can someone please help me understand why my botto...
# compose
a
can someone please help me understand why my bottom navigation composable causes the screen to reset when I moved between the bottom navigation tabs. Code in thread
Copy code
@Composable
fun HomeScreenScaffold(navigateToScreen: (AppScreens, String) -> Unit) {
    val scaffoldState = rememberScaffoldState()
    val navController = rememberNavController()

    val currentBackStackEntry by navController.currentBackStackEntryAsState()

    SystemUiControlView(
        statusBarColor = ScoutTheme.colors.bottomNavBarBackground,
        navigationBarColor = ScoutTheme.colors.bottomNavBarBackground
    ) {
        Scaffold(
            backgroundColor = ScoutTheme.colors.secondaryBackground,
            scaffoldState = scaffoldState,
            bottomBar = {
                HomeBottomNavBar(selectedRoute = extractSelectedRoute(entry = currentBackStackEntry)) {
                    navController.navigate(it) {
                        launchSingleTop = true
                        restoreState = true
                    }
                }
            },
            content = { HomePagerContent(navController = navController, navigateToScreen = navigateToScreen) }
        )
    }
}

@Composable
private fun HomePagerContent(navController: NavHostController, navigateToScreen: (AppScreens, String) -> Unit) {
    NavHost(navController = navController, startDestination = Discover.route) {
        composable(route = Discover.route) {
            DiscoverTab(navigateToScreen = navigateToScreen)
        }
        composable(route = Search.route) {
            SearchTab()
        }
        composable(route = Collection.route) {
            CollectionTab()
        }
    }
DiscoverTab is another Scaffold Composable and navigating away from the DiscoverTab and coming back to it works and state is preserved. Only when I navigate using the bottom navigation tabs, is when the state doesn't get preserved
Never mind was missing
Copy code
popUpTo(navController.graph.findStartDestination().id) {
    saveState = true
}
Although based on what I can read in the docs, this only ensures that we don't create a big back stack so I dunno how that fixed the problem I was seeing. On a secondary note, I am not sure if it's just me but I find this way of building bottom navigation bar kind counterintuitive. Perhaps there is a gap in my understanding
i
Well, if you never save the state of a tab, there's nothing to restore when you go back to that tab. It is like you are starting from scratch. If you haven't already, I'd suggest reading the multiple back stacks blog post to understand how it works under the hood: https://link.medium.com/QXSqEZYJZhb
a
This might be obvious but I am kinda struggling to understand how this solves the problem I had mentioned. I read through the article and also looked at the example it gives and it's recommended way of integrating a bottom navigation bar (https://developer.android.com/jetpack/compose/navigation#bottom-nav) only ever saves the state of the startDestination of the bottom navigation bar which mean any time you navigate away from FriendList composable and come back to it, it will be re-created ? I say this because having followed what the article suggested, it does fix the initial problem I had my DiscoverTab is not being saved and restored properly but now let's say a user visits the SearchTab and searches for something and has a bunch of result and then happens to navigate to another tab, and come back, the state is lost. Is there an example somewhere that handles this elegantly that I could look at and follow ? Or consequently, is there a recommended way to ensure that state of bottom navigation tabs is maintained.
please ignore I found out what I was doing wrong
m
@Abhishek Dewan I'm facing the same issue, when navigating between bottom tabs, the scroll state of my screens for example doesn't get restored. How did you fix it ?