feat: animation for chatrouter appear
Signed-off-by: Infi <infi@infi.sh>
This commit is contained in:
parent
1b2379667a
commit
6c20dee6c9
|
|
@ -15,6 +15,7 @@ import androidx.activity.compose.setContent
|
|||
import androidx.activity.viewModels
|
||||
import androidx.appcompat.app.AppCompatActivity
|
||||
import androidx.compose.animation.AnimatedContentTransitionScope
|
||||
import androidx.compose.animation.core.CubicBezierEasing
|
||||
import androidx.compose.animation.core.EaseInOutExpo
|
||||
import androidx.compose.animation.core.FiniteAnimationSpec
|
||||
import androidx.compose.animation.core.tween
|
||||
|
|
@ -70,6 +71,7 @@ import chat.revolt.screens.labs.LabsRootScreen
|
|||
import chat.revolt.screens.login.LoginGreetingScreen
|
||||
import chat.revolt.screens.login.LoginScreen
|
||||
import chat.revolt.screens.login.MfaScreen
|
||||
import chat.revolt.screens.login2.InitScreen
|
||||
import chat.revolt.screens.register.OnboardingScreen
|
||||
import chat.revolt.screens.register.RegisterDetailsScreen
|
||||
import chat.revolt.screens.register.RegisterGreetingScreen
|
||||
|
|
@ -510,8 +512,22 @@ fun AppEntrypoint(
|
|||
}
|
||||
)
|
||||
}
|
||||
|
||||
composable("login2/init") { InitScreen(navController) }
|
||||
|
||||
composable("chat") {
|
||||
composable("chat",
|
||||
enterTransition = {
|
||||
slideIntoContainer(
|
||||
AnimatedContentTransitionScope.SlideDirection.Up,
|
||||
animationSpec = tween(
|
||||
400,
|
||||
// cf. https://m3.material.io/styles/motion/easing-and-duration/tokens-specs#cbea5c6e-7b0d-47a0-98c3-767080a38d95
|
||||
easing = CubicBezierEasing(0.05f, 0.7f, 0.1f, 1f)
|
||||
),
|
||||
initialOffset = { it / 3 }
|
||||
) + fadeIn(animationSpec = RevoltTweenFloat)
|
||||
}
|
||||
) {
|
||||
ChatRouterScreen(
|
||||
navController,
|
||||
windowSizeClass,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,111 @@
|
|||
package chat.revolt.screens.login2
|
||||
|
||||
import androidx.compose.foundation.Image
|
||||
import androidx.compose.foundation.layout.Arrangement
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.foundation.layout.Spacer
|
||||
import androidx.compose.foundation.layout.fillMaxHeight
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.foundation.layout.fillMaxWidth
|
||||
import androidx.compose.foundation.layout.height
|
||||
import androidx.compose.foundation.layout.offset
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.widthIn
|
||||
import androidx.compose.material3.Button
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.material3.TextButton
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.draw.scale
|
||||
import androidx.compose.ui.graphics.ColorFilter
|
||||
import androidx.compose.ui.res.painterResource
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import androidx.navigation.NavController
|
||||
import chat.revolt.R
|
||||
import chat.revolt.api.settings.LoadedSettings
|
||||
import chat.revolt.ui.theme.Theme
|
||||
|
||||
@Composable
|
||||
fun InitScreen(
|
||||
navController: NavController
|
||||
) {
|
||||
Box {
|
||||
Image(
|
||||
painter = painterResource(R.drawable.login_bg),
|
||||
modifier = Modifier
|
||||
.scale(3f)
|
||||
.offset(y = 32.dp)
|
||||
.align(Alignment.TopCenter),
|
||||
colorFilter = if (LoadedSettings.theme == Theme.M3Dynamic) ColorFilter.tint(
|
||||
MaterialTheme.colorScheme.tertiaryContainer
|
||||
) else null,
|
||||
contentDescription = null
|
||||
)
|
||||
Column(
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
verticalArrangement = Arrangement.SpaceEvenly,
|
||||
modifier = Modifier.fillMaxSize()
|
||||
) {
|
||||
Column(
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
verticalArrangement = Arrangement.Center,
|
||||
modifier = Modifier
|
||||
.weight(0.5f)
|
||||
.padding(horizontal = 16.dp)
|
||||
) {
|
||||
Spacer(modifier = Modifier.height(64.dp))
|
||||
Image(
|
||||
painter = painterResource(R.drawable.revolt_logo_wide),
|
||||
contentDescription = null,
|
||||
colorFilter = ColorFilter.tint(
|
||||
MaterialTheme.colorScheme.onBackground
|
||||
),
|
||||
modifier = Modifier.fillMaxWidth(0.5f)
|
||||
)
|
||||
Spacer(modifier = Modifier.height(64.dp))
|
||||
Text(
|
||||
"Find your community",
|
||||
style = MaterialTheme.typography.headlineMedium,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
Spacer(modifier = Modifier.height(16.dp))
|
||||
Text(
|
||||
"Revolt is the chat app that’s truly built with you in mind.",
|
||||
style = MaterialTheme.typography.bodyLarge,
|
||||
fontSize = 18.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
}
|
||||
Column(
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
verticalArrangement = Arrangement.spacedBy(
|
||||
8.dp,
|
||||
alignment = Alignment.Bottom
|
||||
),
|
||||
modifier = Modifier
|
||||
.weight(0.5f)
|
||||
.padding(horizontal = 16.dp)
|
||||
.widthIn(max = 150.dp)
|
||||
) {
|
||||
Button(
|
||||
onClick = { navController.navigate("login2/existing/details") },
|
||||
modifier = Modifier.fillMaxWidth()
|
||||
) {
|
||||
Text("Log In")
|
||||
}
|
||||
TextButton(
|
||||
onClick = { navController.navigate("login2/new/details") },
|
||||
modifier = Modifier.fillMaxWidth()
|
||||
) {
|
||||
Text("Sign Up")
|
||||
}
|
||||
Spacer(modifier = Modifier.fillMaxHeight(0.25f))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue