Tlaster / PreCompose

Compose Multiplatform Navigation && State Management

Home Page:https://tlaster.github.io/PreCompose/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Navigation stuck when using with NavigationBar

corneloaie opened this issue · comments

When I change the tabs quickly, the screen will get stuck in one tab and tapping on another will not make the navigation.

@Composable
fun App() {
    PreComposeApp {
        RoTraficTheme {
            val snackbarHostState = remember { SnackbarHostState() }
            val navigator = rememberNavigator()
            val appViewModel = koinViewModel(vmClass = AppViewModel::class)
            val state by appViewModel.uiState.collectAsStateWithLifecycle()

            Scaffold(
                snackbarHost = { SnackbarHost(snackbarHostState) },
                bottomBar = {
                    val currentEntry = navigator.currentEntry.collectAsState(null)
                    val currentRoute = currentEntry.value?.route?.route ?: ""
                    val canNavigate = navigator.canNavigate.collectAsState(null)

                    if (state.showBottomNavigation) {
                        NavigationBar {
                            bottomNavItems.forEach { navItem ->
                                NavigationBarItem(
                                    icon = {
                                        Icon(
                                            painter = rememberVectorPainter(navItem.third),
                                            contentDescription = navItem.second
                                        )
                                    },
                                    label = { Text(navItem.second) },
                                    selected = currentRoute == navItem.first,
                                    onClick = {
                                        if (canNavigate.value == true)
                                            navigator.navigate(
                                                route = navItem.first, options = NavOptions(
                                                    popUpTo = PopUpTo(
                                                        route = navItem.first,
                                                        inclusive = true
                                                    ),
                                                    launchSingleTop = true,
                                                )
                                            )
                                    }
                                )
                            }
                        }
                    }
                },
                floatingActionButton = {
                    if (state.showFloatingActionButton) {
                        FloatingActionButton(onClick = { /*TODO*/ }) {
                            Icon(
                                imageVector = Icons.Rounded.Add,
                                contentDescription = "Add Post"
                            )
                        }
                    }
                }
            ) {
                NavHost(
                    navigator = navigator,
                    initialRoute = AppRoutes.Feed.value,
                    modifier = Modifier.padding(it)
                ) {
                    scene(AppRoutes.Login.value) {
                        appViewModel.acceptIntent(AppIntent.ShowBottomNavigationAndFloatingAb(false))
                        val loginViewModel = koinViewModel(vmClass = LoginViewModel::class)
                        LoginScreen(loginViewModel) { appIntent ->
                            appViewModel.acceptIntent(appIntent)
                        }
                    }

                    group(AppRoutes.Main.value, initialRoute = AppRoutes.Feed.value) {
                        appViewModel.acceptIntent(AppIntent.ShowBottomNavigationAndFloatingAb(true))
                        scene(AppRoutes.Feed.value) {
                            Text(AppRoutes.Feed.value)
                        }
                        scene(AppRoutes.Chat.value) {
                            Text(AppRoutes.Chat.value)
                        }
                        scene(AppRoutes.Profile.value) {
                            Text(AppRoutes.Profile.value)
                        }
                        scene(AppRoutes.Notifications.value) {
                            Text(AppRoutes.Notifications.value)
                        }
                    }
                }
            }
        }
    }
}

Found solution here #267