提问人:UwUs 提问时间:11/14/2023 更新时间:11/14/2023 访问量:28
Android studio kotlin 导航抽屉和底部导航栏
Android studio kotlin navigation drawer& bottom navigation bar
问:
我正在学习 Android 开发,在开发我的第一个应用程序时遇到了一个挑战。 具体来说,我在同时实现导航底部栏和侧抽屉时遇到了困难。目前,它们似乎一次只能正常工作 - 我可以查看抽屉或底部导航,但不能同时查看两者。我尝试过使用脚手架,但这似乎不起作用。这是我的代码:
data class NavigationItem(
val title: String,
val selectedIcon: ImageVector,
val unselectedIcon: ImageVector,
val badgeCount: Int? = null
)
@OptIn(ExperimentalMaterial3Api::class)
class MainActivity : ComponentActivity() {
@SuppressLint("UnusedMaterial3ScaffoldPaddingParameter")
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
BlancheTheme {
val items = listOf(
NavigationItem(
title = "Home",
selectedIcon = Icons.Filled.Home,
unselectedIcon = Icons.Outlined.Home,
),
NavigationItem(
title = "Orders",
selectedIcon = Icons.Filled.List,
unselectedIcon = Icons.Filled.List,
),
NavigationItem(
title = "Foto's",
selectedIcon = Icons.Filled.Add,
unselectedIcon = Icons.Outlined.Add,
),
NavigationItem(
title = "Prijzen",
selectedIcon = Icons.Filled.Create,
unselectedIcon = Icons.Filled.Create,
),
)
var selectedItemIndex by rememberSaveable {
mutableStateOf(0)
}
Surface(
modifier = Modifier.fillMaxSize(),
color = MaterialTheme.colorScheme.background
) {
val drawerState = rememberDrawerState(initialValue = DrawerValue.Closed)
val scope = rememberCoroutineScope()
ModalNavigationDrawer(
drawerContent = {
ModalDrawerSheet {
items.forEachIndexed{index, item -> NavigationDrawerItem(
label = { Text(text = item.title)},
selected = index == selectedItemIndex,
onClick = { selectedItemIndex = index
scope.launch { drawerState.close() }},
icon = {Icon(imageVector = if(index == selectedItemIndex){item.selectedIcon}else item.unselectedIcon, contentDescription = item.title)}) }
}
},
drawerState = drawerState
) {
Scaffold (
topBar = {
TopAppBar(title = {
Text(text = "Blanche") },
navigationIcon = {
IconButton(onClick = {
scope.launch {
drawerState.open()
}
}) {
Icon(
imageVector = Icons.Default.Menu,
contentDescription = "Menu"
)
}
}
)
}
) {
}
}
Scaffold (
bottomBar = {
NavigationBar {
items.forEachIndexed{index, item -> NavigationBarItem(
selected = selectedItemIndex == index,
onClick = { selectedItemIndex= index
// navController.navigate(item.title)
},
label = {
Text(text = item.title)
},
icon = {
BadgedBox(
badge = {
if (item.badgeCount != null){
Badge {
Text(text = item.badgeCount.toString())
}
}
}
) {
Icon(
imageVector = if(index == selectedItemIndex){
item.selectedIcon
}
else
item.unselectedIcon,
contentDescription = item.title
)
}
})}
}
}
) {
}
}
}
}
}
}
Thanks in advance
答: 暂无答案
评论