-
Notifications
You must be signed in to change notification settings - Fork 2
[feat/#30] Splash UI 구현 #33
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from all commits
f3e2252
94480a0
ef86ad6
9460a1d
c118ab0
0cd2fbc
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,102 @@ | ||
| package com.paw.key.presentation.ui.login | ||
|
|
||
| import androidx.compose.foundation.background | ||
| import androidx.compose.foundation.layout.Arrangement | ||
| import androidx.compose.foundation.layout.Column | ||
| import androidx.compose.foundation.layout.PaddingValues | ||
| import androidx.compose.foundation.layout.Spacer | ||
| import androidx.compose.foundation.layout.fillMaxSize | ||
| import androidx.compose.foundation.layout.height | ||
| import androidx.compose.foundation.layout.padding | ||
| import androidx.compose.material3.SnackbarHostState | ||
| import androidx.compose.material3.Text | ||
| import androidx.compose.runtime.Composable | ||
| import androidx.compose.ui.Modifier | ||
| import androidx.compose.ui.tooling.preview.Preview | ||
| import androidx.compose.ui.unit.dp | ||
| import androidx.hilt.navigation.compose.hiltViewModel | ||
| import com.paw.key.core.designsystem.component.PawkeyButton | ||
| import com.paw.key.core.designsystem.theme.PawKeyTheme | ||
| import com.paw.key.presentation.ui.home.viewmodel.HomeViewModel | ||
|
|
||
| @Composable | ||
| fun LoginRoute( | ||
| paddingValues: PaddingValues, | ||
| navigateUp: () -> Unit, | ||
| navigateNext: () -> Unit, | ||
| navigateSignUp: () -> Unit, | ||
| snackBarHostState: SnackbarHostState, | ||
| modifier: Modifier = Modifier, | ||
| viewModel: HomeViewModel = hiltViewModel(), | ||
| ) { | ||
|
|
||
| LoginScreen( | ||
| paddingValues = paddingValues, | ||
| navigateUp = navigateUp, | ||
| navigateNext = navigateNext, | ||
| navigateSignUp = navigateSignUp, | ||
| snackBarHostState = snackBarHostState, | ||
| modifier = modifier | ||
| ) | ||
| } | ||
|
|
||
| @Preview(showBackground = true) | ||
| @Composable | ||
| fun PreviewLoginScreen() { | ||
| PawKeyTheme { | ||
| LoginScreen( | ||
| paddingValues = PaddingValues(), | ||
| navigateUp = {}, | ||
| navigateNext = {}, | ||
| navigateSignUp = {}, | ||
| snackBarHostState = SnackbarHostState(), | ||
| modifier = Modifier | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| @Composable | ||
| fun LoginScreen( | ||
| paddingValues: PaddingValues, | ||
| navigateUp: () -> Unit, | ||
| navigateNext: () -> Unit, | ||
| navigateSignUp: () -> Unit, | ||
| snackBarHostState: SnackbarHostState, | ||
| modifier: Modifier = Modifier, | ||
| ) { | ||
| Column( | ||
| modifier = modifier | ||
| .fillMaxSize() | ||
| .padding(horizontal = 16.dp, vertical = 48.dp) | ||
| .background(color = PawKeyTheme.colors.white1) | ||
| ) { | ||
| Column( | ||
|
Member
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 여기 부분 column 없이 가능할 거 같은데 깊어질 수록 성능저하가 발생하기 때문에 확인해주세용 |
||
| modifier = Modifier | ||
| .fillMaxSize() | ||
| ) { | ||
| Spacer(modifier = Modifier.height(36.dp)) | ||
| Text( | ||
| text = "안녕하세요\n우리 강아지를 위한 산책,\n${"PAWKEY"}와 함께해요! ", | ||
| color = PawKeyTheme.colors.black, | ||
| style = PawKeyTheme.typography.head22B | ||
| ) | ||
|
|
||
| Spacer(modifier = Modifier.weight(1F)) | ||
|
|
||
| Column( | ||
| verticalArrangement = Arrangement.spacedBy(10.dp) | ||
| ) { | ||
| PawkeyButton( | ||
| text = "로그인", | ||
| enabled = true, | ||
| onClick = { navigateSignUp() }, | ||
| ) | ||
| PawkeyButton( | ||
| text = "회원가입", | ||
| enabled = false, | ||
| onClick = { navigateSignUp() }, | ||
| ) | ||
| } | ||
| } | ||
| } | ||
| } | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| package com.paw.key.presentation.ui.login.navigation | ||
|
|
||
| import androidx.compose.foundation.layout.PaddingValues | ||
| import androidx.compose.material3.SnackbarHostState | ||
| import androidx.compose.ui.Modifier | ||
| import androidx.navigation.NavController | ||
| import androidx.navigation.NavGraphBuilder | ||
| import androidx.navigation.NavOptions | ||
| import androidx.navigation.compose.composable | ||
| import com.paw.key.core.navigation.Route | ||
| import com.paw.key.presentation.ui.login.LoginRoute | ||
| import kotlinx.serialization.Serializable | ||
|
|
||
| fun NavController.navigateLogin( | ||
| navOptions: NavOptions?, | ||
| ) { | ||
| navigate(Login, navOptions) | ||
| } | ||
|
|
||
| fun NavGraphBuilder.loginNavGraph( | ||
| paddingValues: PaddingValues, | ||
| navigateUp: () -> Unit, | ||
| navigateNext: () -> Unit, | ||
| navigateSignUp: () -> Unit, | ||
| snackBarHostState: SnackbarHostState, | ||
| modifier: Modifier = Modifier, | ||
| ) { | ||
| composable<Login> { | ||
| LoginRoute( | ||
| paddingValues = paddingValues, | ||
| navigateUp = navigateUp, | ||
| navigateNext = navigateNext, | ||
| navigateSignUp = navigateSignUp, | ||
| snackBarHostState = snackBarHostState, | ||
| modifier = modifier | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| @Serializable | ||
| data object Login : Route |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -12,16 +12,19 @@ import com.paw.key.presentation.ui.course.navigation.courseNavGraph | |
| import com.paw.key.presentation.ui.dummy.navigation.dummyNavGraph | ||
| import com.paw.key.presentation.ui.dummy.next.dummyNextNavGraph | ||
| import com.paw.key.presentation.ui.home.navigation.homeNavGraph | ||
| import com.paw.key.presentation.ui.login.navigation.loginNavGraph | ||
| import com.paw.key.presentation.ui.mypage.navigation.myPageNavGraph | ||
| import com.paw.key.presentation.ui.owner.navigation.ownerNavGraph | ||
| import com.paw.key.presentation.ui.pet.navigation.petNavGraph | ||
| import com.paw.key.presentation.ui.signup.navigation.signupNavGraph | ||
| import com.paw.key.presentation.ui.splash.navigation.splashNavGraph | ||
|
|
||
| @Composable | ||
| fun PawKeyNavHost ( | ||
| fun PawKeyNavHost( | ||
| navigator: MainNavigator, | ||
| paddingValues: PaddingValues, | ||
| snackbarHostState: SnackbarHostState, | ||
| modifier: Modifier = Modifier | ||
| modifier: Modifier = Modifier, | ||
| ) { | ||
| NavHost( | ||
| navController = navigator.navController, | ||
|
|
@@ -31,7 +34,7 @@ fun PawKeyNavHost ( | |
| popEnterTransition = { EnterTransition.None }, | ||
| popExitTransition = { ExitTransition.None }, | ||
| ) { | ||
| homeNavGraph ( | ||
| homeNavGraph( | ||
| paddingValues = paddingValues, | ||
| navigateUp = navigator.navController::navigateUp, | ||
| navigateNext = navigator::navigateCourse, | ||
|
|
@@ -84,5 +87,29 @@ fun PawKeyNavHost ( | |
| dummyNextNavGraph( | ||
| paddingValues = paddingValues | ||
| ) | ||
|
|
||
| splashNavGraph( | ||
| paddingValues = paddingValues, | ||
| navigateUp = navigator::navigateUp, | ||
| navigateNext = navigator::navigateDummyNext, | ||
| navigateLogin = navigator::navigateLogin, | ||
| snackBarHostState = snackbarHostState | ||
| ) | ||
|
Comment on lines
+91
to
+97
Member
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. navigateNext 자체가 splash의 다음을 지정하는거라 navigateLogin을 따로 만들어서 할 필요가 없을 것 같아요~ 밑에도 다시 확인해주세여~ |
||
|
|
||
| loginNavGraph( | ||
| paddingValues = paddingValues, | ||
| navigateUp = navigator::navigateUp, | ||
| navigateNext = navigator::navigateDummyNext, | ||
| navigateSignUp = navigator::navigateSignUp, | ||
| snackBarHostState = snackbarHostState | ||
| ) | ||
|
|
||
| signupNavGraph( | ||
| paddingValues = paddingValues, | ||
| navigateUp = navigator::navigateUp, | ||
| navigateNext = navigator::navigateDummyNext, | ||
| navigateLogin = navigator::navigateLogin, | ||
| snackBarHostState = snackbarHostState | ||
| ) | ||
| } | ||
| } | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,111 @@ | ||
| package com.paw.key.presentation.ui.splash | ||
|
|
||
| import androidx.compose.foundation.background | ||
| import androidx.compose.foundation.layout.Box | ||
| import androidx.compose.foundation.layout.Column | ||
| import androidx.compose.foundation.layout.PaddingValues | ||
| import androidx.compose.foundation.layout.Spacer | ||
| import androidx.compose.foundation.layout.fillMaxSize | ||
| import androidx.compose.foundation.layout.height | ||
| import androidx.compose.foundation.layout.padding | ||
| import androidx.compose.foundation.layout.size | ||
| import androidx.compose.material3.Icon | ||
| import androidx.compose.material3.SnackbarHostState | ||
| import androidx.compose.material3.Text | ||
| import androidx.compose.runtime.Composable | ||
| import androidx.compose.runtime.LaunchedEffect | ||
| import androidx.compose.runtime.collectAsState | ||
| import androidx.compose.ui.Alignment | ||
| import androidx.compose.ui.Modifier | ||
| import androidx.compose.ui.graphics.Color | ||
| import androidx.compose.ui.graphics.vector.ImageVector | ||
| import androidx.compose.ui.res.stringResource | ||
| import androidx.compose.ui.res.vectorResource | ||
| import androidx.compose.ui.tooling.preview.Preview | ||
| import androidx.compose.ui.unit.dp | ||
| import androidx.hilt.navigation.compose.hiltViewModel | ||
| import com.paw.key.R | ||
| import com.paw.key.core.designsystem.theme.PawKeyTheme | ||
| import com.paw.key.presentation.ui.splash.state.SplashContract | ||
| import com.paw.key.presentation.ui.splash.viewmodel.SplashViewModel | ||
|
|
||
| @Preview(showBackground = true) | ||
| @Composable | ||
| fun PreviewSplashScreen() { | ||
|
Member
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. private!?!?!?!?!?!?!?!?!?!?!?!?!?!?!?!?!?!?!?"~!? |
||
| PawKeyTheme { | ||
| SplashScreen( | ||
| paddingValues = PaddingValues(), | ||
| navigateUp = {}, | ||
| navigateNext = {}, | ||
| navigateLogin = {}, | ||
| snackBarHostState = SnackbarHostState() | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| @Composable | ||
| fun SplashRoute( | ||
| paddingValues: PaddingValues, | ||
| navigateUp: () -> Unit, | ||
| navigateNext: () -> Unit, | ||
| navigateLogin: () -> Unit, | ||
| snackBarHostState: SnackbarHostState, | ||
| modifier: Modifier = Modifier, | ||
| viewModel: SplashViewModel = hiltViewModel(), | ||
| ) { | ||
| val effectFlow = viewModel.sideeffect | ||
|
|
||
| LaunchedEffect(Unit) { | ||
| effectFlow.collect { effect -> | ||
| when (effect) { | ||
| is SplashContract.SplashSideEffect.NavigateToLogin -> navigateLogin() | ||
| } | ||
| } | ||
| } | ||
|
|
||
| SplashScreen( | ||
| paddingValues = paddingValues, | ||
| navigateUp = navigateUp, | ||
| navigateNext = navigateNext, | ||
| navigateLogin = navigateLogin, | ||
| snackBarHostState = snackBarHostState, | ||
| modifier = modifier | ||
| ) | ||
| } | ||
|
|
||
|
|
||
| @Composable | ||
| fun SplashScreen( | ||
| paddingValues: PaddingValues, | ||
| navigateUp: () -> Unit, | ||
| navigateNext: () -> Unit, | ||
| navigateLogin: () -> Unit, | ||
| snackBarHostState: SnackbarHostState, | ||
| modifier: Modifier = Modifier, | ||
| ) { | ||
| Box( | ||
| modifier = modifier | ||
| .fillMaxSize() | ||
| .padding(paddingValues) | ||
| .background(color = PawKeyTheme.colors.green500), | ||
| contentAlignment = Alignment.Center | ||
| ) { | ||
| Column(horizontalAlignment = Alignment.CenterHorizontally) { | ||
| Icon( | ||
| imageVector = ImageVector.vectorResource(id = R.drawable.ic_logo_draft), | ||
| contentDescription = stringResource(id = R.string.ic_logo), | ||
|
Member
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 굿뜨 |
||
| tint = Color.Unspecified, | ||
| modifier = Modifier.size(154.dp) | ||
| ) | ||
|
|
||
| Spacer(modifier = Modifier.height(16.dp)) | ||
|
|
||
| Text( | ||
| text = stringResource(id = R.string.ic_logo), | ||
| color = PawKeyTheme.colors.white1, | ||
| style = PawKeyTheme.typography.head22B | ||
| ) | ||
| } | ||
| } | ||
| } | ||
|
|
||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Private 로 해주세요~