I have a layout where I have some common content o...
# compose
I have a layout where I have some common content outside of my navHost which works fine except I have some nav routes where we don’t want to display the components outside of the navHost so I’m hiding them. I have this working fine except, the animation for hiding the stuff outside of the navHost happens before the navigation within the navhost completes which results in a really bad looking transition. I was wondering if anyone else had found a good way to solve this. Details and code examples in 🧵
My code is similar to something like this:
Copy code
val currentScreen = Screens.from(navController.currentBackStackEntryAsState())
Row {
    if(!currentScreen.isFullScreen) {
    Column {
        if(!currentScreen.isFullScreen) {
            // define composables
I’m using navController.currentBackStackAsState() to update the SideBar and TopBar when a navigation occurs, but I’m seeing a recomposition with the new back stack entry before the navhost has rendered the new view so what happens is the old view shifts for a frame because sideBar and TopBar are removed and then the new view fades in which doesn’t look good
So for most views, this works fine because SideBar() and TopBar() don’t change, but when going to a “full screen” view, the transition looks bad. I’ve tried
for TopBar and SideBar and it helps, but the shifting still happens and doesn’t look right because those animations are out of sync with the navigation animation
Did you look at using the
API? That gives you the list of all destinations that are currently visible (i.e., the one coming in and the one going out while the animation is happening), thus letting you only run animations after the animation finishes: https://github.com/google/accompanist/issues/633#issuecomment-942988181
🙌 1
today i learned 1
I did not. That was exactly what I was looking for but didn’t see that. I’ll try that out. Thanks!