I am creating an application with Kotlin Multiplatform using Compose Multiplatform, I am using the Voyager library to do the navigation of the application.
I have a BottomNavigationBar configured and it works correctly and inside the main Tab I have a button that navigates to a Screen, the problem is that when I navigate to the Screen, it replaces the Tab and if I click again on the BottomNavigationBar to go back to that main screen, it does nothing.
@Composable
fun App() {
val tabs = listOf(HomeTab, MapsTab)
MaterialTheme {
TabNavigator(tab = HomeTab,
tabDisposable = {
TabDisposable(
navigator = it,
tabs = tabs
)
}
) {
Scaffold(topBar = {
TopAppBar(title = {
Text(text = it.current.options.title)
})
}, bottomBar = {
BottomNavigation {
tabs.forEach { tab ->
TabNavigationItem(tab)
}
}
}, content = {
CurrentTab()
})
}
}
}
@Composable
fun RowScope.TabNavigationItem(tab: Tab) {
val tabNavigator = LocalTabNavigator.current
BottomNavigationItem(
selected = tabNavigator.current.key == tab.key,
onClick = {
tabNavigator.current = tab
},
icon = {
tab.options.icon?.let { safePainter ->
Icon(
painter = safePainter,
contentDescription = tab.options.title
)
}
}
)
}
object HomeTab : Tab {
override val options: TabOptions
@Composable
get() {
val icon = rememberVectorPainter(Icons.Default.Home)
return remember {
TabOptions(
index = 0u,
title = "Home",
icon = icon
)
}
}
@Composable
override fun Content() {
Navigator(screen = HomeScreen()) { navigator ->
SlideTransition(navigator = navigator)
}
}
}
class HomeScreen : Screen {
@Composable
override fun Content() {
val navigator = LocalNavigator.currentOrThrow
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Button(onClick = {
navigator.push(DetailScreen())
}) {
Text("Go to detail")
}
}
}
}
I understand why this is happening, and that is that when I am in DetailScreen, the Tab is still the same, so it tries to make CurrentTab() the same as it already is, but I don’t know how to change this behaviour.
