更新登录页面样式
- 更新登录页面文案为字符串资源 - 新增邮箱和密码校验 - 更新按钮样式 - 调整页面布局
This commit is contained in:
@@ -12,6 +12,7 @@ import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.layout.ContentScale
|
||||
import androidx.compose.ui.res.painterResource
|
||||
import androidx.compose.ui.text.font.FontStyle
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.unit.sp
|
||||
import com.aiosman.riderpro.ui.modifiers.noRippleClickable
|
||||
@@ -41,7 +42,7 @@ fun ActionButton(
|
||||
verticalAlignment = Alignment.CenterVertically
|
||||
) {
|
||||
leading?.invoke()
|
||||
Text(text, fontSize = 16.sp, color = color, fontWeight = FontWeight.W400)
|
||||
Text(text, fontSize = 14.sp, color = color, fontWeight = FontWeight.W600, fontStyle = FontStyle.Italic)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -16,8 +16,10 @@ import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.material3.Checkbox
|
||||
import androidx.compose.material3.CheckboxDefaults
|
||||
import androidx.compose.material3.ExperimentalMaterial3Api
|
||||
import androidx.compose.material3.LocalMinimumInteractiveComponentEnforcement
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.runtime.CompositionLocalProvider
|
||||
import androidx.compose.runtime.getValue
|
||||
import androidx.compose.runtime.mutableStateOf
|
||||
import androidx.compose.runtime.remember
|
||||
@@ -28,7 +30,9 @@ import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.platform.LocalContext
|
||||
import androidx.compose.ui.res.painterResource
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import androidx.credentials.CredentialManager
|
||||
import com.aiosman.riderpro.AppStore
|
||||
import com.aiosman.riderpro.LocalNavController
|
||||
@@ -57,17 +61,12 @@ fun UserAuthScreen() {
|
||||
val scope = rememberCoroutineScope()
|
||||
val navController = LocalNavController.current
|
||||
val context = LocalContext.current
|
||||
val credentialManager = CredentialManager.create(context)
|
||||
var emailError by remember { mutableStateOf<String?>(null) }
|
||||
var passwordError by remember { mutableStateOf<String?>(null) }
|
||||
fun validateForm(): Boolean {
|
||||
if (email.isEmpty()) {
|
||||
Toast.makeText(context, "Email is required", Toast.LENGTH_SHORT).show()
|
||||
return false
|
||||
}
|
||||
if (password.isEmpty()) {
|
||||
Toast.makeText(context, "Password is required", Toast.LENGTH_SHORT).show()
|
||||
return false
|
||||
}
|
||||
return true
|
||||
emailError = if (email.isEmpty()) context.getString(R.string.text_error_email_required) else null
|
||||
passwordError = if (password.isEmpty()) context.getString(R.string.text_error_password_required) else null
|
||||
return emailError == null && passwordError == null
|
||||
}
|
||||
|
||||
fun onLogin() {
|
||||
@@ -137,65 +136,76 @@ fun UserAuthScreen() {
|
||||
.fillMaxWidth()
|
||||
.padding(top = 16.dp, start = 16.dp, end = 16.dp)
|
||||
) {
|
||||
NoticeScreenHeader("LOGIN", moreIcon = false)
|
||||
NoticeScreenHeader(stringResource(R.string.login_upper), moreIcon = false)
|
||||
}
|
||||
|
||||
Spacer(modifier = Modifier.padding(68.dp))
|
||||
TextInputField(
|
||||
Column(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.weight(1f)
|
||||
.padding(horizontal = 24.dp),
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
) {
|
||||
Spacer(modifier = Modifier.padding(48.dp))
|
||||
TextInputField(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth(),
|
||||
text = email,
|
||||
onValueChange = {
|
||||
email = it
|
||||
},
|
||||
label = "What's your email?",
|
||||
hint = "Enter your email"
|
||||
label = stringResource(R.string.login_email_label),
|
||||
hint = stringResource(R.string.text_hint_email),
|
||||
error = emailError
|
||||
)
|
||||
Spacer(modifier = Modifier.padding(16.dp))
|
||||
TextInputField(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.padding(horizontal = 24.dp),
|
||||
.fillMaxWidth(),
|
||||
text = password,
|
||||
onValueChange = {
|
||||
password = it
|
||||
},
|
||||
password = true,
|
||||
label = "What's your password?",
|
||||
hint = "Enter your password"
|
||||
label = stringResource(R.string.login_password_label),
|
||||
hint = stringResource(R.string.text_hint_password),
|
||||
error = passwordError
|
||||
)
|
||||
Spacer(modifier = Modifier.height(32.dp))
|
||||
Row(
|
||||
verticalAlignment = Alignment.CenterVertically
|
||||
) {
|
||||
CompositionLocalProvider(LocalMinimumInteractiveComponentEnforcement provides false) {
|
||||
Checkbox(
|
||||
checked = rememberMe,
|
||||
onCheckedChange = {
|
||||
rememberMe = it
|
||||
},
|
||||
modifier = Modifier.padding(start = 24.dp),
|
||||
colors = CheckboxDefaults.colors(
|
||||
checkedColor = Color.Black
|
||||
),
|
||||
)
|
||||
Text("Remember me", modifier = Modifier.padding(start = 4.dp))
|
||||
Text(
|
||||
stringResource(R.string.remember_me),
|
||||
modifier = Modifier.padding(start = 8.dp),
|
||||
fontSize = 12.sp
|
||||
)
|
||||
Spacer(modifier = Modifier.weight(1f))
|
||||
Text("Forgot password?", modifier = Modifier.padding(end = 24.dp))
|
||||
Text(stringResource(R.string.forgot_password), fontSize = 12.sp)
|
||||
}
|
||||
}
|
||||
Spacer(modifier = Modifier.height(64.dp))
|
||||
ActionButton(
|
||||
modifier = Modifier
|
||||
.width(345.dp)
|
||||
.height(48.dp),
|
||||
text = "LET'S RIDE".uppercase(),
|
||||
text = stringResource(R.string.lets_ride_upper),
|
||||
backgroundImage = R.mipmap.rider_pro_signup_red_bg
|
||||
) {
|
||||
onLogin()
|
||||
}
|
||||
|
||||
Spacer(modifier = Modifier.height(121.dp))
|
||||
Text("or login with", color = Color(0xFF999999))
|
||||
Spacer(modifier = Modifier.height(48.dp))
|
||||
Text(stringResource(R.string.or_login_with), color = Color(0xFF999999))
|
||||
Spacer(modifier = Modifier.height(16.dp))
|
||||
Row {
|
||||
Box(
|
||||
@@ -216,6 +226,8 @@ fun UserAuthScreen() {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -18,4 +18,15 @@
|
||||
<string name="comment_count">%d条评论</string>
|
||||
<string name="post_comment_hint">说点什么</string>
|
||||
<string name="follow_upper">关注</string>
|
||||
<string name="login_upper">登录</string>
|
||||
<string name="lets_ride_upper">确认</string>
|
||||
<string name="or_login_with">其他账号登录</string>
|
||||
<string name="remember_me">记住我</string>
|
||||
<string name="forgot_password">忘记密码</string>
|
||||
<string name="login_password_label">密码</string>
|
||||
<string name="login_email_label">邮箱</string>
|
||||
<string name="text_error_email_required">邮箱是必填项</string>
|
||||
<string name="text_error_password_required">密码是必填项</string>
|
||||
<string name="text_hint_email">输入邮箱</string>
|
||||
<string name="text_hint_password">输入密码</string>
|
||||
</resources>
|
||||
@@ -17,4 +17,15 @@
|
||||
<string name="comment_count">%d Comments</string>
|
||||
<string name="post_comment_hint">Say something...</string>
|
||||
<string name="follow_upper">FOLLOW</string>
|
||||
<string name="login_upper">LOGIN</string>
|
||||
<string name="lets_ride_upper">LET\'S RIDE</string>
|
||||
<string name="or_login_with">or login with</string>
|
||||
<string name="remember_me">Remember me</string>
|
||||
<string name="forgot_password">Forgot password?</string>
|
||||
<string name="login_password_label">What\'s your password</string>
|
||||
<string name="login_email_label">What\'s your email</string>
|
||||
<string name="text_error_email_required">Email is required</string>
|
||||
<string name="text_error_password_required">Password is required</string>
|
||||
<string name="text_hint_email">Enter your email</string>
|
||||
<string name="text_hint_password">Enter your password</string>
|
||||
</resources>
|
||||
Reference in New Issue
Block a user