英文:
BottomNavigationItem doesn't adopt the material theme jetpack compose
问题
我正在将我的应用迁移到 Jetpack Compose，主题和样式让我有些头疼。
我已经按照这个教程中所解释的方式实现了底部导航。
我还设置了背景颜色如下：
backgroundColor = MaterialTheme.colorScheme.background
但底部导航项没有对更改作出反应。选定的项目没有突出显示。
我期望材料主题会自动应用。
我正在使用 Material 3。
英文:
I am migrating my app to jetpack compose and the theming and styling is giving me some headache.
I have implemented Bottom Navigation as explained in this tutorial.
I have also set the background color as such:
backgroundColor = MaterialTheme.colorScheme.background
but the bottom navigation items don't react to changes. The selected item is not highlighted.
My expectation was that the material theme would be applied automatically.
I am using Material 3.
答案1
得分: 4
我的问题是我在使用BottomNavigation和BottomNavigationItem。我切换到NavigationBar和NavigationBarItem后，设计现在根据MaterialTheme进行了调整。
英文:
My Problem was that I was using BottomNavigation and BottomNavigationItem.
I switched to NavigationBar and NavigationBarItem and the design is now adjusted based upon the MaterialTheme.
答案2
得分: 1
backgroundColor 参数定义了 BottomNavigation 的背景颜色。如果您想要更改 BottomNavigationItem 的背景颜色，您可以在每个项目中使用 background 修饰符。
类似于：
BottomNavigation (
backgroundColor = Yellow
) {
items.forEachIndexed { index, item ->
BottomNavigationItem(
modifier = if (selectedItem == index) Modifier.background(Red) else Modifier,
selectedContentColor = White,
unselectedContentColor = Gray,
//...
)
}
}
英文:
The backgroundColor parameter defines the background color for the BottomNavigation. If you want to change the background color of the BottomNavigationItem you can use the background Modifier in each item.
Something like:
BottomNavigation (
backgroundColor = Yellow
) {
items.forEachIndexed { index, item ->
BottomNavigationItem(
modifier = if (selectedItem == index) Modifier.background(Red) else Modifier,
selectedContentColor = White,
unselectedContentColor = Gray,
//...
)
}
}
答案3
得分: 0
底部导航背景默认为primarySurface，
// 来自文档
backgroundColor: Color = MaterialTheme.colors.primarySurface
但如果您正在使用lightColorScheme/darkColorScheme，它不允许您在主题中设置该属性。
您需要覆盖BottomNavigation中的backgroundColor以匹配所需的colorScheme属性。您还可能希望将BottomNavigationItem中的"selectedContentColor"更改为与背景的onColor版本（未选定内容的颜色默认为所选内容颜色的中等alpha版本）。
英文:
The problem is that BottomNavigation background defaults to primarySurface,
//From docs
backgroundColor: Color = MaterialTheme.colors.primarySurface
but if you're using the lightColorScheme/darkColorScheme it doesn't let you set that attribute in your theme.
You'll have to override the backgroundColor in BottomNavigation to match the colorScheme attribute you want. You might also want to change "selectedContentColor" in BottomNavigationItem to the onColor version of the background (unselectedContentColor defaults to a medium alpha version of whatever selectedContentColor is)
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论