First draft at the login screen

This commit is contained in:
Z. Charles Dziura 2024-08-18 10:05:49 -04:00
parent 085634c95a
commit 6c257f9e60
4 changed files with 52 additions and 4 deletions

View file

@ -66,6 +66,7 @@ dependencies {
implementation(libs.androidx.navigation.compose)
implementation(libs.androidx.lifecycle.viewmodel.compose)
implementation(libs.lifecycle.runtime.compose)
implementation(libs.androidx.material.icons.extended)
testImplementation(libs.junit)
androidTestImplementation(libs.androidx.junit)
androidTestImplementation(libs.androidx.espresso.core)

View file

@ -6,16 +6,22 @@ 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.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
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.foundation.text.KeyboardOptions
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.Lock
import androidx.compose.material.icons.outlined.Person
import androidx.compose.material3.Button
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Scaffold
import androidx.compose.material3.SecondaryTabRow
@ -26,10 +32,15 @@ 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.text.LinkAnnotation
import androidx.compose.ui.text.SpanStyle
import androidx.compose.ui.text.TextLinkStyles
import androidx.compose.ui.text.buildAnnotatedString
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.KeyboardCapitalization
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.text.withLink
import androidx.compose.ui.unit.dp
import software.makeshift.debtpirate.R
@ -130,34 +141,67 @@ private fun LoginForm(
) {
val (username, password) = state
Column(horizontalAlignment = Alignment.CenterHorizontally, modifier = Modifier.fillMaxSize()) {
Column(
modifier = Modifier
.padding(16.dp)
.fillMaxSize()
) {
OutlinedTextField(
value = username,
label = { Text(stringResource(id = R.string.login_screen__username)) },
placeholder = { Text(stringResource(id = R.string.login_screen__username)) },
leadingIcon = { Icon(Icons.Outlined.Person, "person") },
singleLine = true,
keyboardOptions = KeyboardOptions(
capitalization = KeyboardCapitalization.Unspecified,
keyboardType = KeyboardType.Email,
imeAction = ImeAction.Next
),
onValueChange = onUsernameUpdate
onValueChange = onUsernameUpdate,
modifier = Modifier.fillMaxWidth()
)
OutlinedTextField(
value = password,
label = { Text(stringResource(id = R.string.login_screen__password)) },
placeholder = { Text(stringResource(id = R.string.login_screen__password)) },
leadingIcon = { Icon(Icons.Outlined.Lock, "password") },
singleLine = true,
keyboardOptions = KeyboardOptions(
capitalization = KeyboardCapitalization.Unspecified,
keyboardType = KeyboardType.Password,
imeAction = ImeAction.Send
),
visualTransformation = PasswordVisualTransformation(),
onValueChange = onPasswordUpdate
onValueChange = onPasswordUpdate,
modifier = Modifier
.fillMaxWidth()
.padding(PaddingValues(top = 8.dp))
)
Button(onClick = { /*TODO*/ }) {
Text(
text = buildAnnotatedString {
withLink(
LinkAnnotation.Url(
"", TextLinkStyles(
style = SpanStyle(
color = Color.Blue
)
)
)
) {
append(stringResource(id = R.string.login_screen__forgot_password))
}
},
modifier = Modifier.padding(PaddingValues(top = 16.dp))
)
Button(
onClick = { /*TODO*/ },
modifier = Modifier
.fillMaxWidth()
.padding(PaddingValues(top = 16.dp))
) {
Text(stringResource(id = R.string.login_screen__login))
}
}

View file

@ -6,5 +6,6 @@
<string name="login_screen__signup">Sign Up</string>
<string name="login_screen__username">Username</string>
<string name="login_screen__password">Password</string>
<string name="login_screen__forgot_password">Forgot Password</string>
</resources>

View file

@ -15,6 +15,7 @@ lifecycleRuntimeKtx = "2.8.4"
activityCompose = "1.9.1"
composeBom = "2024.06.00"
navigation = "2.8.0-beta01"
iconsExtended = "1.7.0-beta07"
[libraries]
androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
@ -38,6 +39,7 @@ androidx-ui-test-manifest = { group = "androidx.compose.ui", name = "ui-test-man
androidx-ui-test-junit4 = { group = "androidx.compose.ui", name = "ui-test-junit4" }
androidx-navigation-compose = { group = "androidx.navigation", name = "navigation-compose", version.ref = "navigation" }
androidx-navigation-testing = { group = "androidx.navigation", name = "navigation-testing", version.ref = "navigation" }
androidx-material-icons-extended = { group = "androidx.compose.material", name = "material-icons-extended-android", version.ref = "iconsExtended" }
[plugins]
android-application = { id = "com.android.application", version.ref = "agp" }