Skip to content

Commit e4e4dec

Browse files
jakerosemanjakeroseman
committed
Basic drop down menu examples
1 parent 0c9024b commit e4e4dec

File tree

3 files changed

+157
-1
lines changed

3 files changed

+157
-1
lines changed

‎compose/snippets/src/main/java/com/example/compose/snippets/SnippetsActivity.kt‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ import com.example.compose.snippets.components.DatePickerExamples
4141
import com.example.compose.snippets.components.DialogExamples
4242
import com.example.compose.snippets.components.DividerExamples
4343
import com.example.compose.snippets.components.FloatingActionButtonExamples
44+
import com.example.compose.snippets.components.MenusExamples
4445
import com.example.compose.snippets.components.PartialBottomSheet
4546
import com.example.compose.snippets.components.ProgressIndicatorExamples
4647
import com.example.compose.snippets.components.ScaffoldExample
@@ -111,6 +112,7 @@ class SnippetsActivity : ComponentActivity() {
111112
TopComponentsDestination.TimePickerExamples -> TimePickerExamples()
112113
TopComponentsDestination.DatePickerExamples -> DatePickerExamples()
113114
TopComponentsDestination.CarouselExamples -> CarouselExamples()
115+
TopComponentsDestination.MenusExamples -> MenusExamples()
114116
}
115117
}
116118
}

‎compose/snippets/src/main/java/com/example/compose/snippets/components/Menu.kt‎

Lines changed: 153 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
package com.example.compose.snippets.components
2+
3+
import android.util.Log
4+
import androidx.compose.foundation.clickable
5+
import androidx.compose.foundation.interaction.MutableInteractionSource
6+
import androidx.compose.foundation.layout.Arrangement
7+
import androidx.compose.foundation.layout.Box
8+
import androidx.compose.foundation.layout.Column
9+
import androidx.compose.foundation.layout.Row
10+
import androidx.compose.foundation.layout.fillMaxSize
11+
import androidx.compose.foundation.layout.fillMaxWidth
12+
import androidx.compose.foundation.layout.height
13+
import androidx.compose.foundation.layout.padding
14+
import androidx.compose.foundation.layout.width
15+
import androidx.compose.foundation.layout.wrapContentSize
16+
import androidx.compose.foundation.text.KeyboardOptions
17+
import androidx.compose.material.icons.Icons
18+
import androidx.compose.material.icons.filled.ArrowDropDown
19+
import androidx.compose.material.icons.filled.MoreVert
20+
import androidx.compose.material.icons.filled.Phone
21+
import androidx.compose.material3.Button
22+
import androidx.compose.material3.DropdownMenu
23+
import androidx.compose.material3.DropdownMenuItem
24+
import androidx.compose.material3.ExperimentalMaterial3Api
25+
import androidx.compose.material3.ExposedDropdownMenuBox
26+
import androidx.compose.material3.ExposedDropdownMenuDefaults
27+
import androidx.compose.material3.FloatingActionButton
28+
import androidx.compose.material3.HorizontalDivider
29+
import androidx.compose.material3.Icon
30+
import androidx.compose.material3.IconButton
31+
import androidx.compose.material3.MenuAnchorType
32+
import androidx.compose.material3.OutlinedTextField
33+
import androidx.compose.material3.Text
34+
import androidx.compose.material3.TextField
35+
import androidx.compose.material3.TopAppBar
36+
import androidx.compose.material3.VerticalDivider
37+
import androidx.compose.runtime.Composable
38+
import androidx.compose.runtime.LaunchedEffect
39+
import androidx.compose.runtime.getValue
40+
import androidx.compose.runtime.mutableStateOf
41+
import androidx.compose.runtime.remember
42+
import androidx.compose.runtime.setValue
43+
import androidx.compose.ui.Alignment
44+
import androidx.compose.ui.Modifier
45+
import androidx.compose.ui.text.font.FontWeight
46+
import androidx.compose.ui.text.input.KeyboardType
47+
import androidx.compose.ui.text.style.TextAlign
48+
import androidx.compose.ui.tooling.preview.Preview
49+
import androidx.compose.ui.unit.dp
50+
import androidx.compose.ui.unit.sp
51+
52+
@Composable
53+
fun MenusExamples() {
54+
var currentExample by remember { mutableStateOf<(@Composable () -> Unit)?>(null) }
55+
56+
// Display the current example and the button to close it.
57+
Box(modifier = Modifier.fillMaxSize()) {
58+
currentExample?.let{
59+
it()
60+
FloatingActionButton(
61+
onClick = { currentExample = null },
62+
modifier = Modifier
63+
.align(Alignment.BottomEnd)
64+
.padding(16.dp)
65+
) {
66+
Text(text = "Close example", modifier = Modifier.padding(16.dp))
67+
}
68+
return
69+
}
70+
}
71+
72+
// Display the list of available examples.
73+
Column(modifier = Modifier.padding(16.dp)) {
74+
Button(onClick = { currentExample = { BasicDropdownMenu() } }) {
75+
Text("Action Bar Menu")
76+
}
77+
Button(onClick = { currentExample = { TextFieldDropdownMenu() } }) {
78+
Text("Options Menu")
79+
}
80+
}
81+
}
82+
83+
@OptIn(ExperimentalMaterial3Api::class)
84+
// [START android_compose_components_basicdropdownmenu]
85+
@Composable
86+
fun BasicDropdownMenu() {
87+
var shouldDisplayMenu by remember { mutableStateOf(false) }
88+
89+
TopAppBar(
90+
title = { Text(text = "Basic menu example") },
91+
actions = {
92+
IconButton(onClick = { shouldDisplayMenu = !shouldDisplayMenu }) {
93+
Icon(Icons.Default.MoreVert, "")
94+
}
95+
DropdownMenu(expanded = shouldDisplayMenu, onDismissRequest = { shouldDisplayMenu = false }) {
96+
DropdownMenuItem(text = { Text("Refresh") }, onClick = { /* Handle refresh! */ })
97+
DropdownMenuItem(text = { Text("Settings") }, onClick = { /* Handle settings! */ })
98+
}
99+
}
100+
)
101+
}
102+
// [END android_compose_components_basicdropdownmenu]
103+
104+
@Preview
105+
@Composable
106+
private fun BasicDropdownMenuPreview() {
107+
BasicDropdownMenu()
108+
}
109+
110+
// [START android_compose_components_textfielddropdownmenu]
111+
@Composable
112+
fun TextFieldDropdownMenu() {
113+
var expanded by remember { mutableStateOf(false) }
114+
var selectedText by remember { mutableStateOf("") }
115+
val options = listOf("Option 1", "Option 2", "Option 3")
116+
117+
Box (modifier = Modifier.fillMaxWidth()) {
118+
TextField(
119+
value = selectedText,
120+
onValueChange = { selectedText = it },
121+
modifier = Modifier.fillMaxWidth(),
122+
label = { Text("Select an option") },
123+
trailingIcon = {
124+
IconButton(onClick = { expanded = true }) {
125+
Icon(Icons.Filled.ArrowDropDown, "Dropdown arrow")
126+
}
127+
},
128+
readOnly = true
129+
)
130+
DropdownMenu(
131+
expanded = expanded,
132+
onDismissRequest = { expanded = false },
133+
modifier = Modifier.fillMaxWidth()
134+
) {
135+
options.forEach { option ->
136+
DropdownMenuItem(
137+
text = { Text(option) },
138+
onClick = {
139+
selectedText = option
140+
expanded = false
141+
}
142+
)
143+
}
144+
}
145+
}
146+
}
147+
// [END android_compose_components_textfielddropdownmenu]
148+
149+
@Preview
150+
@Composable
151+
private fun TextFieldMenuPreview() {
152+
TextFieldDropdownMenu()
153+
}

‎compose/snippets/src/main/java/com/example/compose/snippets/navigation/Destination.kt‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,5 +44,6 @@ enum class TopComponentsDestination(val route: String, val title: String) {
4444
PartialBottomSheet("partialBottomSheets", "Partial Bottom Sheet"),
4545
TimePickerExamples("timePickerExamples", "Time Pickers"),
4646
DatePickerExamples("datePickerExamples", "Date Pickers"),
47-
CarouselExamples("carouselExamples", "Carousel")
47+
CarouselExamples("carouselExamples", "Carousel"),
48+
MenusExamples("menusExamples", "Menus")
4849
}

0 commit comments

Comments
 (0)