android compose 控件学习一（BottomAppBar）

原创已于 2025-04-29 13:32:41 修改 · 232 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #java #前端

于 2025-04-29 13:22:18 首次发布

Android compose 学习专栏收录该内容

41 篇文章

订阅专栏

1.添加lib库

implementation("androidx.navigation:navigation-common:2.8.9")
implementation("androidx.navigation:navigation-compose:2.8.9")
implementation("androidx.compose.material3:material3:1.3.2")
implementation("androidx.compose.material3.adaptive:adaptive:1.1.0")
implementation("androidx.compose.material3.adaptive:adaptive-layout-android:1.1.0")
implementation("androidx.compose.material3.adaptive:adaptive-navigation-android:1.1.0")
implementation("androidx.compose.material3.adaptive:adaptive-navigation:1.1.0")
implementation("androidx.compose.material3:material3-adaptive-navigation-suite:1.3.2")
implementation("androidx.compose.material:material:1.8.0")
implementation("androidx.compose.material:material-icons-extended:1.7.8")
implementation("androidx.compose.material:material-icons-core:1.7.8")
implementation("androidx.compose.material3:material3-window-size-class:1.3.2")

库的版本号，可以采用最新的或稳定版。

Scaffold(
    bottomBar = {
        BottomAppBar(
            actions = {
                IconButton(onClick = { /* do something */ }) {
                    Icon(Icons.Filled.Check, contentDescription = "Localized description")
                }
                IconButton(onClick = { /* do something */ }) {
                    Icon(
                        Icons.Filled.Edit,
                        contentDescription = "Localized description",
                    )
                }
                IconButton(onClick = { /* do something */ }) {
                    Icon(
                        Icons.Filled.Mic,
                        contentDescription = "Localized description",
                    )
                }
                IconButton(onClick = { /* do something */ }) {
                    Icon(
                        Icons.Filled.Image,
                        contentDescription = "Localized description",
                    )
                }
            },
            floatingActionButton = {
                FloatingActionButton(
                    onClick = { /* do something */ },
                    containerColor = BottomAppBarDefaults.bottomAppBarFabColor,
                    elevation = FloatingActionButtonDefaults.bottomAppBarFabElevation()
                ) {
                    Icon(Icons.Filled.Add, "Localized description")
                }
            }
        )
    },
) { innerPadding ->
    Text(
        modifier = Modifier.padding(innerPadding),
        text = "Example of a scaffold with a bottom app bar."
    )
}