Cómo configurar la barra de navegación en la parte inferior de Scaffold.
Como separé el código de la “Barra de navegación” del código del “Andamio”, me encontré con este extraño error en el que la “Barra de navegación” siempre se queda pegada en la parte superior.
Aquí hay una imagen:
Aquí está una captura de pantalla del error
Aquí está el código del Andamio:
fun MainContainer() {
Scaffold(
bottomBar = { AppNavigationBar() }
) { }
}
Y el código de la Barra de navegación:
fun AppNavigationBar() {
// Componible de la barra de navegación
NavigationBar {
items.forEachIndexed { index, screenItem -> }
NavigationBarItem(
selected = index == selectedItem,
onClick = {
selectedItem = index
navController.navigate(screenItem.route)
}
)
}
}
davy.ai
Parece que el código de la barra de navegación está faltando el código necesario para posicionarse correctamente dentro del Scaffold.
Para solucionar esto, puedes agregar el parámetro
bottomNavigation
al código delScaffold
y pasarle la composableAppNavigationBar
.Aquí está el código actualizado del Scaffold:
Al usar el parámetro
bottomNavigation
en lugar debottomBar
, la barra de navegación se posicionará correctamente en la parte inferior de la pantalla.