1 /*
<lambda>null2 * Copyright 2023 The Android Open Source Project
3 *
4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at
7 *
8 * http://www.apache.org/licenses/LICENSE-2.0
9 *
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 * See the License for the specific language governing permissions and
14 * limitations under the License.
15 */
16
17 package androidx.compose.material3.demos
18
19 import androidx.compose.foundation.layout.Arrangement
20 import androidx.compose.foundation.layout.Column
21 import androidx.compose.foundation.layout.Row
22 import androidx.compose.foundation.layout.fillMaxSize
23 import androidx.compose.foundation.layout.padding
24 import androidx.compose.foundation.lazy.LazyColumn
25 import androidx.compose.foundation.lazy.items
26 import androidx.compose.material.icons.Icons
27 import androidx.compose.material.icons.filled.Delete
28 import androidx.compose.material3.ExperimentalMaterial3Api
29 import androidx.compose.material3.Icon
30 import androidx.compose.material3.IconButton
31 import androidx.compose.material3.ListItem
32 import androidx.compose.material3.OutlinedButton
33 import androidx.compose.material3.OutlinedCard
34 import androidx.compose.material3.OutlinedTextField
35 import androidx.compose.material3.PlainTooltip
36 import androidx.compose.material3.Text
37 import androidx.compose.material3.TooltipBox
38 import androidx.compose.material3.TooltipDefaults
39 import androidx.compose.material3.TooltipState
40 import androidx.compose.material3.rememberTooltipState
41 import androidx.compose.runtime.Composable
42 import androidx.compose.runtime.getValue
43 import androidx.compose.runtime.mutableStateListOf
44 import androidx.compose.runtime.mutableStateOf
45 import androidx.compose.runtime.remember
46 import androidx.compose.runtime.rememberCoroutineScope
47 import androidx.compose.runtime.setValue
48 import androidx.compose.ui.Modifier
49 import androidx.compose.ui.unit.dp
50 import kotlinx.coroutines.launch
51
52 @OptIn(ExperimentalMaterial3Api::class)
53 @Composable
54 fun TooltipDemo() {
55 val listData = remember { mutableStateListOf<ItemInfo>() }
56
57 Column(
58 modifier = Modifier.padding(horizontal = 1.dp),
59 verticalArrangement = Arrangement.spacedBy(4.dp)
60 ) {
61 Text("Add items to the list")
62 Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) {
63 var textFieldValue by remember { mutableStateOf("") }
64 var textFieldTooltipText by remember { mutableStateOf("") }
65 val textFieldTooltipState = rememberTooltipState()
66 val scope = rememberCoroutineScope()
67 TooltipBox(
68 positionProvider = TooltipDefaults.rememberTooltipPositionProvider(),
69 tooltip = { PlainTooltip { Text(textFieldTooltipText) } },
70 state = textFieldTooltipState
71 ) {
72 OutlinedTextField(
73 value = textFieldValue,
74 placeholder = { Text("Item Name") },
75 onValueChange = { newVal -> textFieldValue = newVal }
76 )
77 }
78
79 OutlinedButton(
80 onClick = {
81 if (textFieldValue.isBlank()) {
82 textFieldTooltipText = "Please give the item a name!"
83 scope.launch { textFieldTooltipState.show() }
84 } else {
85 val listItem = ItemInfo(textFieldValue, TooltipState())
86 listData.add(listItem)
87 textFieldValue = ""
88 scope.launch { listItem.addedTooltipState.show() }
89 }
90 }
91 ) {
92 Text("Add")
93 }
94 }
95
96 LazyColumn(verticalArrangement = Arrangement.spacedBy(4.dp)) {
97 items(listData) { item ->
98 TooltipBox(
99 positionProvider = TooltipDefaults.rememberTooltipPositionProvider(),
100 tooltip = { PlainTooltip { Text("${item.itemName} added to list") } },
101 state = item.addedTooltipState
102 ) {
103 ListItemCard(itemName = item.itemName, onDelete = { listData.remove(item) })
104 }
105 }
106 }
107 }
108 }
109
110 @OptIn(ExperimentalMaterial3Api::class)
111 @Composable
ListItemCardnull112 fun ListItemCard(itemName: String, onDelete: () -> Unit) {
113 OutlinedCard(modifier = Modifier.fillMaxSize()) {
114 ListItem(
115 headlineContent = { Text(itemName) },
116 trailingContent = {
117 TooltipBox(
118 positionProvider = TooltipDefaults.rememberTooltipPositionProvider(),
119 tooltip = { PlainTooltip { Text("Delete $itemName") } },
120 state = rememberTooltipState(),
121 enableUserInput = true
122 ) {
123 IconButton(onClick = onDelete) {
124 Icon(
125 imageVector = Icons.Filled.Delete,
126 contentDescription = "Delete $itemName from list."
127 )
128 }
129 }
130 }
131 )
132 }
133 }
134
135 @OptIn(ExperimentalMaterial3Api::class)
136 class ItemInfo(val itemName: String, val addedTooltipState: TooltipState)
137