Reorganizing authentication screen code
This commit is contained in:
parent
e559a3362d
commit
d48c47af41
7 changed files with 87 additions and 173 deletions
|
@ -9,9 +9,8 @@ import androidx.navigation.compose.NavHost
|
|||
import androidx.navigation.compose.composable
|
||||
import androidx.navigation.compose.rememberNavController
|
||||
import kotlinx.serialization.Serializable
|
||||
import software.makeshift.debtpirate.screens.login.LoginFormViewModel
|
||||
import software.makeshift.debtpirate.screens.login.LoginScreen
|
||||
import software.makeshift.debtpirate.screens.login.signup.SignUpFormViewModel
|
||||
import software.makeshift.debtpirate.screens.auth.LoginScreen
|
||||
import software.makeshift.debtpirate.screens.auth.signup.SignUpFormViewModel
|
||||
import software.makeshift.debtpirate.ui.theme.DebtPirateTheme
|
||||
|
||||
@Serializable
|
||||
|
@ -28,7 +27,6 @@ class MainActivity : ComponentActivity() {
|
|||
NavHost(navController = navController, startDestination = LoginRoute) {
|
||||
composable<LoginRoute> {
|
||||
LoginScreen(
|
||||
loginFormViewModel = viewModel<LoginFormViewModel>(),
|
||||
signUpFormViewModel = viewModel<SignUpFormViewModel>()
|
||||
)
|
||||
}
|
||||
|
@ -36,12 +34,4 @@ class MainActivity : ComponentActivity() {
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//@Preview(showBackground = true)
|
||||
//@Composable
|
||||
//fun GreetingPreview() {
|
||||
// DebtPirateTheme {
|
||||
// Greeting("Android")
|
||||
// }
|
||||
//}
|
||||
}
|
|
@ -0,0 +1,77 @@
|
|||
package software.makeshift.debtpirate.screens.auth
|
||||
|
||||
import android.annotation.SuppressLint
|
||||
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.Row
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.foundation.layout.fillMaxWidth
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.material3.Scaffold
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.material3.TextButton
|
||||
import androidx.compose.runtime.Composable
|
||||
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.res.stringResource
|
||||
import androidx.compose.ui.unit.dp
|
||||
import software.makeshift.debtpirate.R
|
||||
import software.makeshift.debtpirate.screens.auth.signup.SignUpFormViewModel
|
||||
import software.makeshift.debtpirate.screens.auth.signup.SignUpScreen
|
||||
|
||||
@SuppressLint("UnusedMaterial3ScaffoldPaddingParameter")
|
||||
@Composable
|
||||
fun LoginScreen(
|
||||
signUpFormViewModel: SignUpFormViewModel
|
||||
) {
|
||||
Scaffold(
|
||||
modifier = Modifier.fillMaxSize()
|
||||
) { innerPadding ->
|
||||
Column {
|
||||
LoginTopBar(
|
||||
innerPadding,
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.weight(1f)
|
||||
)
|
||||
|
||||
val displayName = signUpFormViewModel.displayName.collectAsState()
|
||||
val emailAddress = signUpFormViewModel.emailAddress.collectAsState()
|
||||
SignUpScreen(
|
||||
displayName,
|
||||
onDisplayNameUpdate = signUpFormViewModel::updateDisplayName,
|
||||
emailAddress,
|
||||
onEmailAddressUpdate = signUpFormViewModel::updateEmailAddress,
|
||||
modifier = Modifier
|
||||
.weight(3f)
|
||||
.padding(16.dp)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun LoginTopBar(innerPadding: PaddingValues, modifier: Modifier = Modifier) {
|
||||
Box(modifier = modifier.background(Color.Green)) {
|
||||
Text(
|
||||
text = "Hello from Login! I'm in a box!",
|
||||
modifier = Modifier.align(Alignment.Center)
|
||||
)
|
||||
|
||||
Row(
|
||||
modifier = Modifier
|
||||
.align(Alignment.TopEnd)
|
||||
.padding(innerPadding)
|
||||
.padding(16.dp)
|
||||
)
|
||||
{
|
||||
TextButton(onClick = { /*TODO*/ }) {
|
||||
Text(stringResource(id = R.string.login_screen__sign_in))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,4 +1,4 @@
|
|||
package software.makeshift.debtpirate.screens.login
|
||||
package software.makeshift.debtpirate.screens.auth.signin
|
||||
|
||||
import android.util.Log
|
||||
import androidx.compose.foundation.interaction.FocusInteraction
|
||||
|
@ -38,7 +38,7 @@ import kotlinx.coroutines.flow.StateFlow
|
|||
import software.makeshift.debtpirate.R
|
||||
|
||||
@Composable
|
||||
internal fun LoginForm(
|
||||
internal fun SignInScreen(
|
||||
usernameState: StateFlow<String>,
|
||||
passwordState: StateFlow<String>,
|
||||
onUsernameUpdate: (String) -> Unit,
|
|
@ -1,10 +1,10 @@
|
|||
package software.makeshift.debtpirate.screens.login
|
||||
package software.makeshift.debtpirate.screens.auth.signin
|
||||
|
||||
import androidx.lifecycle.ViewModel
|
||||
import kotlinx.coroutines.flow.MutableStateFlow
|
||||
import kotlinx.coroutines.flow.asStateFlow
|
||||
|
||||
class LoginFormViewModel : ViewModel() {
|
||||
class SignInViewModel : ViewModel() {
|
||||
private val _username = MutableStateFlow("")
|
||||
val username = _username.asStateFlow()
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
package software.makeshift.debtpirate.screens.login.signup
|
||||
package software.makeshift.debtpirate.screens.auth.signup
|
||||
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.foundation.layout.PaddingValues
|
||||
|
@ -25,7 +25,7 @@ import androidx.compose.ui.unit.dp
|
|||
import software.makeshift.debtpirate.R
|
||||
|
||||
@Composable
|
||||
internal fun SignUpForm(
|
||||
internal fun SignUpScreen(
|
||||
displayName: State<String>,
|
||||
onDisplayNameUpdate: (String) -> Unit,
|
||||
emailAddress: State<String>,
|
|
@ -1,4 +1,4 @@
|
|||
package software.makeshift.debtpirate.screens.login.signup
|
||||
package software.makeshift.debtpirate.screens.auth.signup
|
||||
|
||||
import androidx.lifecycle.ViewModel
|
||||
import kotlinx.coroutines.flow.MutableStateFlow
|
|
@ -1,153 +0,0 @@
|
|||
@file:OptIn(ExperimentalMaterial3Api::class)
|
||||
|
||||
package software.makeshift.debtpirate.screens.login
|
||||
|
||||
import android.annotation.SuppressLint
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.foundation.layout.ExperimentalLayoutApi
|
||||
import androidx.compose.foundation.layout.PaddingValues
|
||||
import androidx.compose.foundation.layout.Row
|
||||
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.imeNestedScroll
|
||||
import androidx.compose.foundation.layout.imePadding
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.pager.HorizontalPager
|
||||
import androidx.compose.foundation.pager.rememberPagerState
|
||||
import androidx.compose.material3.ExperimentalMaterial3Api
|
||||
import androidx.compose.material3.Scaffold
|
||||
import androidx.compose.material3.SecondaryTabRow
|
||||
import androidx.compose.material3.Tab
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.material3.TextButton
|
||||
import androidx.compose.runtime.Composable
|
||||
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.res.stringResource
|
||||
import androidx.compose.ui.unit.dp
|
||||
import software.makeshift.debtpirate.R
|
||||
import software.makeshift.debtpirate.screens.login.signup.SignUpForm
|
||||
import software.makeshift.debtpirate.screens.login.signup.SignUpFormViewModel
|
||||
|
||||
@SuppressLint("UnusedMaterial3ScaffoldPaddingParameter")
|
||||
@Composable
|
||||
fun LoginScreen(
|
||||
loginFormViewModel: LoginFormViewModel,
|
||||
signUpFormViewModel: SignUpFormViewModel
|
||||
) {
|
||||
Scaffold(
|
||||
modifier = Modifier.fillMaxSize()
|
||||
) { innerPadding ->
|
||||
Column {
|
||||
LoginTopBar(
|
||||
innerPadding,
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.weight(1f)
|
||||
)
|
||||
|
||||
val displayName = signUpFormViewModel.displayName.collectAsState()
|
||||
val emailAddress = signUpFormViewModel.emailAddress.collectAsState()
|
||||
SignUpForm(
|
||||
displayName,
|
||||
onDisplayNameUpdate = signUpFormViewModel::updateDisplayName,
|
||||
emailAddress,
|
||||
onEmailAddressUpdate = signUpFormViewModel::updateEmailAddress,
|
||||
modifier = Modifier
|
||||
.weight(3f)
|
||||
.padding(16.dp)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun LoginTopBar(innerPadding: PaddingValues, modifier: Modifier = Modifier) {
|
||||
Box(modifier = modifier.background(Color.Green)) {
|
||||
Text(
|
||||
text = "Hello from Login! I'm in a box!",
|
||||
modifier = Modifier.align(Alignment.Center)
|
||||
)
|
||||
|
||||
Row(
|
||||
modifier = Modifier
|
||||
.align(Alignment.TopEnd)
|
||||
.padding(innerPadding)
|
||||
.padding(16.dp)
|
||||
)
|
||||
{
|
||||
TextButton(onClick = { /*TODO*/ }) {
|
||||
Text(stringResource(id = R.string.login_screen__sign_in))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@OptIn(ExperimentalLayoutApi::class)
|
||||
@Composable
|
||||
private fun LoginAndSignUpForms(
|
||||
loginFormViewModel: LoginFormViewModel,
|
||||
signUpFormViewModel: SignUpFormViewModel,
|
||||
modifier: Modifier = Modifier
|
||||
) {
|
||||
Column(modifier = modifier) {
|
||||
val pagerState = rememberPagerState(initialPage = 0) { 1 }
|
||||
|
||||
SecondaryTabRow(
|
||||
selectedTabIndex = pagerState.currentPage,
|
||||
modifier = Modifier.height(48.dp)
|
||||
) {
|
||||
Tab(
|
||||
selected = pagerState.currentPage == 1,
|
||||
onClick = { pagerState.requestScrollToPage(1) },
|
||||
text = {
|
||||
Text(
|
||||
text = stringResource(id = R.string.login_screen__signup),
|
||||
)
|
||||
},
|
||||
modifier = Modifier.fillMaxHeight()
|
||||
)
|
||||
// Tab(
|
||||
// selected = pagerState.currentPage == 0,
|
||||
// onClick = { pagerState.requestScrollToPage(0) },
|
||||
// text = {
|
||||
// Text(
|
||||
// text = stringResource(id = R.string.login_screen__login)
|
||||
// )
|
||||
// },
|
||||
// modifier = Modifier.fillMaxHeight()
|
||||
// )
|
||||
}
|
||||
|
||||
HorizontalPager(
|
||||
state = pagerState,
|
||||
modifier = Modifier
|
||||
.fillMaxSize()
|
||||
.imePadding()
|
||||
) { page ->
|
||||
val formContainerModifier = Modifier
|
||||
.padding(16.dp)
|
||||
.fillMaxSize()
|
||||
.imePadding()
|
||||
.imeNestedScroll()
|
||||
|
||||
when (page) {
|
||||
0 -> {
|
||||
SignUpForm(
|
||||
signUpFormViewModel.displayName.collectAsState(),
|
||||
signUpFormViewModel::updateDisplayName,
|
||||
signUpFormViewModel.emailAddress.collectAsState(),
|
||||
signUpFormViewModel::updateEmailAddress,
|
||||
formContainerModifier
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Add table
Reference in a new issue