Repository: google/accompanist

Issue #953: [Navigation] Nested NavHost content disappears during animation
Created: 2022-01-13T12:10:04Z
Description
I have created an app which contains a root NavHost, if user is logged in then Scaffold with BottomBar is shown. Here I use another NavHost. Once I'm navigating in a root NavHost to another destination, content in nested NavHost disappears before animation in root NavHost finishes.
Steps to reproduce

Create NavHost with ScreenA and ScreenB
ScreenA contains some UI elements and nested NavHost with at least one screen ScreenC
Navigate to ScreenB
Nested ScreenC disappears whilst ScreenA animates to ScreenB

Expected behavior

ScreenC will remain visible until animation finishes

Additional context
Video:
https://user-images.githubusercontent.com/12201961/149327432-a3ebaa6a-9585-4987-b4be-a4d052367fff.mp4
Attaching screenshots taken from the video where you can see the blank space:



ScreenA with nested ScreenC
Animation progress (ScreenC is gone)
ScreenB

Duplicate issue #1133: [Navigation Animation] Glitched animations when using nested NavHost
Created: 2022-04-21T05:22:03Z
Description
Below is a sample app that contains two nested navigation controllers and hosts. Clicking on the inner button produces the correct animation, but clicking on the outer button shows a glitched animation in which the inner button disappears before the animation begins. Back button behavior is also glitched.
Steps to reproduce
@file:OptIn(ExperimentalAnimationApi::class)

package com.test.app

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.animation.*
import androidx.compose.foundation.layout.Column
import androidx.compose.material.Button
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.navigation.NavType
import androidx.navigation.navArgument
import com.google.accompanist.navigation.animation.AnimatedNavHost
import com.google.accompanist.navigation.animation.composable
import com.google.accompanist.navigation.animation.rememberAnimatedNavController

class TestActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            Content(this)
        }
    }
}

@Composable
fun Content(context: ComponentActivity) {
    val top = rememberAnimatedNavController()

    AnimatedNavHost(
        top,
        startDestination = "{data}",
    ) {
        composable(
            "{data}",
            arguments = listOf(
                navArgument("data") {
                    type = NavType.StringType
                    defaultValue = "1"
                }
            ),
        ) {
            val outer = it.arguments?.getString("data")?.toInt() ?: 0
            Column(
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
                Button(
                    onClick = {
                        top.navigate("${outer + 1}")
                    }
                ) {
                    Text("$outer")
                }

                val bot = rememberAnimatedNavController()

                AnimatedNavHost(
                    bot,
                    startDestination = "{data}",
                ) {
                    composable(
                        "{data}",
                        arguments = listOf(
                            navArgument("data") {
                                type = NavType.StringType
                                defaultValue = "1"
                            }
                        ),
                    ) {
                        val inner = it.arguments?.getString("data")?.toInt() ?: 0
                        Button(
                            onClick = {
                                bot.navigate("${inner + 1}")
                            }
                        ) {
                            Text("$outer : $inner")
                        }
                    }
                }
            }
        }
    }
}

This navigation-compose version of this demo works correctly. (remove the accompnist imports and import navigation-compose functions.

Closing comment (2022-04-21T05:40:29Z): Duplicate of #953