Monday, January 15, 2024
HomeiOS Developmentandroid - Navigation drawback in Kotlin Multiplatform

android – Navigation drawback in Kotlin Multiplatform


I’m creating an utility with Kotlin Multiplatform utilizing Compose Multiplatform, I’m utilizing the Voyager library to do the navigation of the appliance.

I’ve a BottomNavigationBar configured and it really works appropriately and inside the principle Tab I’ve a button that navigates to a Display screen, the issue is that after I navigate to the Display screen, it replaces the Tab and if I click on once more on the BottomNavigationBar to return to that important display, it does nothing.

@Composable
enjoyable App() {

    val tabs = listOf(HomeTab, MapsTab)

    MaterialTheme {

        TabNavigator(tab = HomeTab,
            tabDisposable = {

                TabDisposable(
                    navigator = it,
                    tabs = tabs
                )
            }
        ) {
            Scaffold(topBar = {
                TopAppBar(title = {
                    Textual content(textual content = it.present.choices.title)
                })
            }, bottomBar = {
                BottomNavigation {
                    tabs.forEach { tab ->
                        TabNavigationItem(tab)
                    }
                }
            }, content material = {
                CurrentTab()
            })
        }
    }

}
@Composable
enjoyable RowScope.TabNavigationItem(tab: Tab) {
    val tabNavigator = LocalTabNavigator.present

    BottomNavigationItem(
        chosen = tabNavigator.present.key == tab.key,
        onClick = {
            tabNavigator.present = tab
        },
        icon = {
            tab.choices.icon?.let { safePainter ->
                Icon(
                    painter = safePainter,
                    contentDescription = tab.choices.title
                )
            }
        }
    )
}
object HomeTab : Tab {

    override val choices: TabOptions
        @Composable
        get() {
            val icon = rememberVectorPainter(Icons.Default.House)

            return keep in mind {
                TabOptions(
                    index = 0u,
                    title = "House",
                    icon = icon
                )
            }
        }

    @Composable
    override enjoyable Content material() {
        Navigator(display = HomeScreen()) { navigator ->
            SlideTransition(navigator = navigator)
        }
    }
}
class HomeScreen : Display screen {

    @Composable
    override enjoyable Content material() {

        val navigator = LocalNavigator.currentOrThrow

        Column(
            modifier = Modifier.fillMaxSize(),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Association.Heart
        ) {

            Button(onClick = {
                navigator.push(DetailScreen())
            }) {
                Textual content("Go to element")
            }
        }
    }
}

I perceive why that is taking place, and that’s that when I’m in DetailScreen, the Tab continues to be the identical, so it tries to make CurrentTab() the identical because it already is, however I do not know find out how to change this behaviour.



Supply hyperlink

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments