Update push animations to match the spec (#199)

This commit is contained in:
David Perez 2023-11-03 09:49:33 -05:00 committed by Álison Fernandes
parent b94cbf4683
commit a8de4b10aa
3 changed files with 60 additions and 18 deletions

View file

@ -2,6 +2,7 @@ package com.x8bit.bitwarden.ui.platform.theme
import android.app.Activity
import android.content.Context
import android.graphics.drawable.ColorDrawable
import android.os.Build
import androidx.annotation.ColorRes
import androidx.compose.foundation.isSystemInDarkTheme
@ -42,6 +43,9 @@ fun BitwardenTheme(
darkTheme -> darkColorScheme(context)
else -> lightColorScheme(context)
}
// This is here to ensure the Scaffold backgrounds are using the surface color. The
// "background" is not used in our current design system and should not impact our screens.
.run { copy(background = surface) }
// Update status bar according to scheme
val view = LocalView.current
@ -52,6 +56,7 @@ fun BitwardenTheme(
val insetsController = WindowCompat.getInsetsController(window, view)
insetsController.isAppearanceLightStatusBars = !darkTheme
insetsController.isAppearanceLightNavigationBars = !darkTheme
window.setBackgroundDrawable(ColorDrawable(colorScheme.surface.value.toInt()))
}
}

View file

@ -6,6 +6,8 @@ import androidx.compose.animation.ExitTransition
import androidx.compose.animation.core.tween
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.animation.slideInHorizontally
import androidx.compose.animation.slideOutHorizontally
import androidx.navigation.NavBackStackEntry
import androidx.navigation.compose.NavHost
@ -37,7 +39,7 @@ const val DEFAULT_SLIDE_TRANSITION_TIME_MS: Int = 450
* The default transition time (in milliseconds) for all slide transitions in the
* [TransitionProviders].
*/
const val DEFAULT_PUSH_TRANSITION_TIME_MS: Int = 300
const val DEFAULT_PUSH_TRANSITION_TIME_MS: Int = 350
/**
* The default transition time (in milliseconds) for all "stay"/no-op transitions in the
@ -220,20 +222,32 @@ object RootTransitionProviders {
* Slides the new screen in from the left of the screen.
*/
val pushLeft: NonNullEnterTransitionProvider = {
slideIntoContainer(
towards = AnimatedContentTransitionScope.SlideDirection.Left,
animationSpec = tween(DEFAULT_PUSH_TRANSITION_TIME_MS),
) + fadeIn(tween(DEFAULT_PUSH_TRANSITION_TIME_MS))
val totalTransitionDurationMs = DEFAULT_PUSH_TRANSITION_TIME_MS
slideInHorizontally(
animationSpec = tween(durationMillis = totalTransitionDurationMs),
initialOffsetX = { fullWidth -> fullWidth / 2 },
) + fadeIn(
animationSpec = tween(
durationMillis = totalTransitionDurationMs / 2,
delayMillis = totalTransitionDurationMs / 2,
),
)
}
/**
* Slides the new screen in from the right of the screen.
*/
val pushRight: NonNullEnterTransitionProvider = {
slideIntoContainer(
towards = AnimatedContentTransitionScope.SlideDirection.Right,
animationSpec = tween(DEFAULT_PUSH_TRANSITION_TIME_MS),
) + fadeIn(tween(DEFAULT_PUSH_TRANSITION_TIME_MS))
val totalTransitionDurationMs = DEFAULT_PUSH_TRANSITION_TIME_MS
slideInHorizontally(
animationSpec = tween(durationMillis = totalTransitionDurationMs),
initialOffsetX = { fullWidth -> -fullWidth / 2 },
) + fadeIn(
animationSpec = tween(
durationMillis = totalTransitionDurationMs / 2,
delayMillis = totalTransitionDurationMs / 2,
),
)
}
/**
@ -273,21 +287,45 @@ object RootTransitionProviders {
/**
* Slides the current screen out to the left of the screen.
*/
@Suppress("MagicNumber")
val pushLeft: NonNullExitTransitionProvider = {
slideOutOfContainer(
towards = AnimatedContentTransitionScope.SlideDirection.Left,
animationSpec = tween(DEFAULT_PUSH_TRANSITION_TIME_MS),
) + fadeOut(tween(DEFAULT_PUSH_TRANSITION_TIME_MS))
val totalTransitionDurationMs = DEFAULT_PUSH_TRANSITION_TIME_MS
val delayMs = totalTransitionDurationMs / 7
val slideWithoutDelayMs = totalTransitionDurationMs - delayMs
slideOutHorizontally(
animationSpec = tween(
durationMillis = slideWithoutDelayMs,
delayMillis = delayMs,
),
targetOffsetX = { fullWidth -> -fullWidth / 2 },
) + fadeOut(
animationSpec = tween(
durationMillis = totalTransitionDurationMs / 2,
delayMillis = delayMs,
),
)
}
/**
* Slides the current screen out to the right of the screen.
*/
@Suppress("MagicNumber")
val pushRight: NonNullExitTransitionProvider = {
slideOutOfContainer(
towards = AnimatedContentTransitionScope.SlideDirection.Right,
animationSpec = tween(DEFAULT_PUSH_TRANSITION_TIME_MS),
) + fadeOut(tween(DEFAULT_PUSH_TRANSITION_TIME_MS))
val totalTransitionDurationMs = DEFAULT_PUSH_TRANSITION_TIME_MS
val delayMs = totalTransitionDurationMs / 7
val slideWithoutDelayMs = totalTransitionDurationMs - delayMs
slideOutHorizontally(
animationSpec = tween(
durationMillis = slideWithoutDelayMs,
delayMillis = delayMs,
),
targetOffsetX = { fullWidth -> fullWidth / 2 },
) + fadeOut(
animationSpec = tween(
durationMillis = totalTransitionDurationMs / 2,
delayMillis = delayMs,
),
)
}
/**

View file

@ -6,7 +6,6 @@
<item name="android:statusBarColor">@android:color/transparent</item>
<item name="android:textCursorDrawable">@null</item>
<item name="android:windowActionBar">false</item>
<item name="android:windowBackground">@color/surface</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowActionModeOverlay">true</item>
<item name="android:windowLayoutInDisplayCutoutMode">default</item>