1 /*
2 * Copyright 2019 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.material.samples
18
19 import androidx.annotation.Sampled
20 import androidx.compose.foundation.layout.Column
21 import androidx.compose.foundation.layout.Row
22 import androidx.compose.foundation.layout.Spacer
23 import androidx.compose.foundation.layout.fillMaxSize
24 import androidx.compose.foundation.layout.fillMaxWidth
25 import androidx.compose.foundation.layout.height
26 import androidx.compose.foundation.layout.padding
27 import androidx.compose.foundation.lazy.LazyColumn
28 import androidx.compose.foundation.selection.toggleable
29 import androidx.compose.material.BottomDrawer
30 import androidx.compose.material.BottomDrawerValue
31 import androidx.compose.material.Button
32 import androidx.compose.material.Checkbox
33 import androidx.compose.material.DrawerValue
34 import androidx.compose.material.ExperimentalMaterialApi
35 import androidx.compose.material.Icon
36 import androidx.compose.material.ListItem
37 import androidx.compose.material.ModalDrawer
38 import androidx.compose.material.Text
39 import androidx.compose.material.icons.Icons
40 import androidx.compose.material.icons.filled.Favorite
41 import androidx.compose.material.rememberBottomDrawerState
42 import androidx.compose.material.rememberDrawerState
43 import androidx.compose.runtime.Composable
44 import androidx.compose.runtime.mutableStateOf
45 import androidx.compose.runtime.remember
46 import androidx.compose.runtime.rememberCoroutineScope
47 import androidx.compose.ui.Alignment
48 import androidx.compose.ui.Modifier
49 import androidx.compose.ui.unit.dp
50 import kotlinx.coroutines.launch
51
52 @Sampled
53 @Composable
ModalDrawerSamplenull54 fun ModalDrawerSample() {
55 val drawerState = rememberDrawerState(DrawerValue.Closed)
56 val scope = rememberCoroutineScope()
57 ModalDrawer(
58 drawerState = drawerState,
59 drawerContent = {
60 Button(
61 modifier = Modifier.align(Alignment.CenterHorizontally).padding(top = 16.dp),
62 onClick = { scope.launch { drawerState.close() } },
63 content = { Text("Close Drawer") }
64 )
65 },
66 content = {
67 Column(
68 modifier = Modifier.fillMaxSize().padding(16.dp),
69 horizontalAlignment = Alignment.CenterHorizontally
70 ) {
71 Text(text = if (drawerState.isClosed) ">>> Swipe >>>" else "<<< Swipe <<<")
72 Spacer(Modifier.height(20.dp))
73 Button(onClick = { scope.launch { drawerState.open() } }) { Text("Click to open") }
74 }
75 }
76 )
77 }
78
79 @Sampled
80 @Composable
81 @OptIn(ExperimentalMaterialApi::class)
BottomDrawerSamplenull82 fun BottomDrawerSample() {
83 val (gesturesEnabled, toggleGesturesEnabled) = remember { mutableStateOf(true) }
84 val scope = rememberCoroutineScope()
85 Column {
86 Row(
87 modifier =
88 Modifier.fillMaxWidth()
89 .toggleable(value = gesturesEnabled, onValueChange = toggleGesturesEnabled)
90 ) {
91 Checkbox(gesturesEnabled, null)
92 Text(text = if (gesturesEnabled) "Gestures Enabled" else "Gestures Disabled")
93 }
94 val drawerState = rememberBottomDrawerState(BottomDrawerValue.Closed)
95 BottomDrawer(
96 gesturesEnabled = gesturesEnabled,
97 drawerState = drawerState,
98 drawerContent = {
99 Button(
100 modifier = Modifier.align(Alignment.CenterHorizontally).padding(top = 16.dp),
101 onClick = { scope.launch { drawerState.close() } },
102 content = { Text("Close Drawer") }
103 )
104 LazyColumn {
105 items(25) {
106 ListItem(
107 text = { Text("Item $it") },
108 icon = {
109 Icon(
110 Icons.Default.Favorite,
111 contentDescription = "Localized description"
112 )
113 }
114 )
115 }
116 }
117 },
118 content = {
119 Column(
120 modifier = Modifier.fillMaxSize().padding(16.dp),
121 horizontalAlignment = Alignment.CenterHorizontally
122 ) {
123 val openText = if (gesturesEnabled) "▲▲▲ Pull up ▲▲▲" else "Click the button!"
124 Text(text = if (drawerState.isClosed) openText else "▼▼▼ Drag down ▼▼▼")
125 Spacer(Modifier.height(20.dp))
126 Button(onClick = { scope.launch { drawerState.open() } }) {
127 Text("Click to open")
128 }
129 }
130 }
131 )
132 }
133 }
134