android Jetpack组合脚手架+模态底板

ev7lccsx 于 2022-12-02 发布在 Android

关注(0)|答案(1)|浏览(138)

我正在尝试使用“合成”设计一个布局，该布局由以下内容组成：
1.顶部应用程序栏
1.正文（内容）
1.底部应用程序栏
1.单击时表示菜单的底部表单（模式底部表单）
-------顶部应用程序栏-------
------主要内容------
------底部应用程序栏-----
----模态底部工作表---
Compose提供3个组件：
1.脚手架
1.底层脚手架
1.模态底部工作表布局

脚手架没有底层板材属性
底部工作表框架没有底部应用工具栏属性
模态底部工作表布局只有内容和工作表内容

Which of these components should I combine and in what **structure** to achieve what I want?

Scaffold(
  topBar = { TopBar() },
  content = { innerPadding -> Body(innerPadding) },
  bottomAppbar = { BottomAppBar() }
)
ModalBottomSheetLayout(
  sheetState = rememberModalBottomSheetState(
    initialValue = ModalBottomSheetValue.Hidden
  ),
  sheetContent = { SheetContent() },
)
BottomSheetScaffold(
  scaffoldState = ...,
  sheetContent = { SheetContent() },
  content = { ScreenContent() },
)

android

来源：https://stackoverflow.com/questions/67744381/jetpack-compose-scaffold-modal-bottom-sheet

1条答案

按热度按时间

8cdiaqws1#

您可以使用类似于以下内容的内容：

val bottomState = rememberModalBottomSheetState(ModalBottomSheetValue.Hidden)
ModalBottomSheetLayout(
    sheetState = bottomState,
    sheetContent = {
        //. sheetContent
    }
) {
    Scaffold(
        scaffoldState = scaffoldState,
        topBar = {
            TopAppBar(
                title = {
                    Text(text = "TopAppBar")
                }
            )
        },
        bottomBar = {
            BottomAppBar(modifier = Modifier) {
                IconButton(
                    onClick = {
                        coroutineScope.launch { bottomState.show() }  
                    }
                ) {
                    Icon(Icons.Filled.Menu, contentDescription = "Localized description")
                }
            }
        },

        content = { innerPadding ->
            //...main content
        }
    )
}

赞(0）回复(0）举报 2022-12-02

我来回答

android Jetpack组合脚手架+模态底板

1条答案

相关问题

热门标签

最新问答