From 01b6e18a2d2fd5aa275774dec6522e7d0c573d0e Mon Sep 17 00:00:00 2001 From: David Perez Date: Thu, 8 Feb 2024 10:50:37 -0600 Subject: [PATCH] BIT-1671: Fix transition jank (#984) --- .../resetpassword/ResetPasswordNavigation.kt | 4 +- .../vaultunlock/VaultUnlockNavigation.kt | 4 +- .../platform/feature/rootnav/RootNavScreen.kt | 38 +++++++++++++------ 3 files changed, 30 insertions(+), 16 deletions(-) diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/resetpassword/ResetPasswordNavigation.kt b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/resetpassword/ResetPasswordNavigation.kt index 0080ce4932..088ff23e23 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/resetpassword/ResetPasswordNavigation.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/resetpassword/ResetPasswordNavigation.kt @@ -3,7 +3,7 @@ package com.x8bit.bitwarden.ui.auth.feature.resetpassword import androidx.navigation.NavController import androidx.navigation.NavGraphBuilder import androidx.navigation.NavOptions -import com.x8bit.bitwarden.ui.platform.base.util.composableWithSlideTransitions +import androidx.navigation.compose.composable const val RESET_PASSWORD_ROUTE: String = "reset_password" @@ -11,7 +11,7 @@ const val RESET_PASSWORD_ROUTE: String = "reset_password" * Add the Reset Password screen to the nav graph. */ fun NavGraphBuilder.resetPasswordDestination() { - composableWithSlideTransitions( + composable( route = RESET_PASSWORD_ROUTE, ) { ResetPasswordScreen() diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/vaultunlock/VaultUnlockNavigation.kt b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/vaultunlock/VaultUnlockNavigation.kt index 03bdfa9512..872cd23774 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/vaultunlock/VaultUnlockNavigation.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/vaultunlock/VaultUnlockNavigation.kt @@ -3,7 +3,7 @@ package com.x8bit.bitwarden.ui.auth.feature.vaultunlock import androidx.navigation.NavController import androidx.navigation.NavGraphBuilder import androidx.navigation.NavOptions -import com.x8bit.bitwarden.ui.platform.base.util.composableWithSlideTransitions +import androidx.navigation.compose.composable const val VAULT_UNLOCK_ROUTE: String = "vault_unlock" @@ -20,7 +20,7 @@ fun NavController.navigateToVaultUnlock( * Add the Vault Unlock screen to the nav graph. */ fun NavGraphBuilder.vaultUnlockDestination() { - composableWithSlideTransitions( + composable( route = VAULT_UNLOCK_ROUTE, ) { VaultUnlockScreen() diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/rootnav/RootNavScreen.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/rootnav/RootNavScreen.kt index c1aab732d0..a4f9295cac 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/rootnav/RootNavScreen.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/rootnav/RootNavScreen.kt @@ -1,11 +1,13 @@ package com.x8bit.bitwarden.ui.platform.feature.rootnav +import androidx.compose.animation.AnimatedContentTransitionScope import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.getValue import androidx.compose.runtime.remember import androidx.hilt.navigation.compose.hiltViewModel import androidx.lifecycle.compose.collectAsStateWithLifecycle +import androidx.navigation.NavBackStackEntry import androidx.navigation.NavDestination import androidx.navigation.NavHostController import androidx.navigation.compose.NavHost @@ -70,10 +72,10 @@ fun RootNavScreen( NavHost( navController = navController, startDestination = SPLASH_ROUTE, - enterTransition = { this.targetState.destination.route.toEnterTransition()(this) }, - exitTransition = { this.targetState.destination.route.toExitTransition()(this) }, - popEnterTransition = { this.targetState.destination.route.toEnterTransition()(this) }, - popExitTransition = { this.targetState.destination.route.toExitTransition()(this) }, + enterTransition = { toEnterTransition()(this) }, + exitTransition = { toExitTransition()(this) }, + popEnterTransition = { toEnterTransition()(this) }, + popExitTransition = { toExitTransition()(this) }, ) { splashDestination() authGraph(navController) @@ -177,15 +179,27 @@ private fun NavDestination?.rootLevelRoute(): String? { /** * Define the enter transition for each route. */ -private fun String?.toEnterTransition(): NonNullEnterTransitionProvider = when (this) { - RESET_PASSWORD_ROUTE -> RootTransitionProviders.Enter.slideUp - else -> RootTransitionProviders.Enter.fadeIn -} +@Suppress("MaxLineLength") +private fun AnimatedContentTransitionScope.toEnterTransition(): NonNullEnterTransitionProvider = + when (targetState.destination.rootLevelRoute()) { + RESET_PASSWORD_ROUTE -> RootTransitionProviders.Enter.slideUp + else -> when (initialState.destination.rootLevelRoute()) { + // The RESET_PASSWORD_ROUTE animation should be stay but due to an issue when combining + // certain animations, we are just using a fadeIn instead. + RESET_PASSWORD_ROUTE -> RootTransitionProviders.Enter.fadeIn + else -> RootTransitionProviders.Enter.fadeIn + } + } /** * Define the exit transition for each route. */ -private fun String?.toExitTransition(): NonNullExitTransitionProvider = when (this) { - RESET_PASSWORD_ROUTE -> RootTransitionProviders.Exit.slideDown - else -> RootTransitionProviders.Exit.fadeOut -} +@Suppress("MaxLineLength") +private fun AnimatedContentTransitionScope.toExitTransition(): NonNullExitTransitionProvider = + when (initialState.destination.rootLevelRoute()) { + RESET_PASSWORD_ROUTE -> RootTransitionProviders.Exit.slideDown + else -> when (targetState.destination.rootLevelRoute()) { + RESET_PASSWORD_ROUTE -> RootTransitionProviders.Exit.stay + else -> RootTransitionProviders.Exit.fadeOut + } + }