唯客微博客

专注于计算机，嵌入式领域的技术

0%

Jetpack Compose组件-抽屉(Drawer)

发表于 更新于 分类于

Jetpack Compose组件-抽屉(Drawer)

底部抽屉(BottomDrawer)

BottomDrawer是一个从底部滑出的界面。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
@Composable
@ExperimentalMaterialApi
fun BottomDrawer(
    // 底部抽屉内容
    drawerContent: @Composable ColumnScope.() -> Unit,
    // 修饰符
    modifier: Modifier = Modifier,
    // 底部抽屉状态源
    drawerState: BottomDrawerState = rememberBottomDrawerState(BottomDrawerValue.Closed),
    // 启用手势
    gesturesEnabled: Boolean = true,
    // 底部抽屉形状
    drawerShape: Shape = MaterialTheme.shapes.large,
    // 底部高度(阴影)
    drawerElevation: Dp = DrawerDefaults.Elevation,
    // 底部背景颜色
    drawerBackgroundColor: Color = MaterialTheme.colors.surface,
    // 底部抽屉内容颜色
    drawerContentColor: Color = contentColorFor(drawerBackgroundColor),
    // 底部抽屉打开后，遮罩颜色
    scrimColor: Color = DrawerDefaults.scrimColor,
    content: @Composable () -> Unit
): Unit

模态抽屉(ModalDrawer)

ModalDrawer是一个从左侧滑出的界面。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
@Composable
fun ModalDrawer(
    // 抽屉内容
    drawerContent: @Composable ColumnScope.() -> Unit,
    // 修饰符
    modifier: Modifier = Modifier,
    // 抽屉状态源
    drawerState: DrawerState = rememberDrawerState(DrawerValue.Closed),
    // 启用手势
    gesturesEnabled: Boolean = true,
    // 抽屉形状
    drawerShape: Shape = MaterialTheme.shapes.large,
    // 高度(阴影)
    drawerElevation: Dp = DrawerDefaults.Elevation,
    // 抽屉背景颜色
    drawerBackgroundColor: Color = MaterialTheme.colors.surface,
    // 抽屉内容颜色
    drawerContentColor: Color = contentColorFor(drawerBackgroundColor),
    // 抽屉打开后，遮罩颜色
    scrimColor: Color = DrawerDefaults.scrimColor,
    content: @Composable () -> Unit
): Unit

模态底部Sheet(ModalBottomSheetLayout)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
@Composable
@ExperimentalMaterialApi
fun ModalBottomSheetLayout(
    // sheet内容
    sheetContent: @Composable ColumnScope.() -> Unit,
    // 修饰符
    modifier: Modifier = Modifier,
    // sheet状态源
    sheetState: ModalBottomSheetState = rememberModalBottomSheetState(Hidden),
    // 抽屉形状
    sheetShape: Shape = MaterialTheme.shapes.large,
    // 高度(阴影)
    sheetElevation: Dp = ModalBottomSheetDefaults.Elevation,
    // sheet背景颜色
    sheetBackgroundColor: Color = MaterialTheme.colors.surface,
    // sheet内容颜色
    sheetContentColor: Color = contentColorFor(sheetBackgroundColor),
    // sheet打开后，遮罩颜色
    scrimColor: Color = ModalBottomSheetDefaults.scrimColor,
    content: @Composable () -> Unit
): Unit
-------------本文结束感谢您的阅读-------------

本文标题:Jetpack Compose组件-抽屉(Drawer)

文章作者:Vinx

发布时间:2023年01月16日 - 14:25

最后更新:2023年09月19日 - 08:42

原始链接:https://blog.vinkvin.com/post/80/

许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。