更新登录页面样式

- 更新登录页面文案为字符串资源
- 新增邮箱和密码校验
- 更新按钮样式
- 调整页面布局

app/src/main/java/com/aiosman/riderpro/ui/composables/ActionButton.kt

@@ -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)
         }
 
     }

app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt

@@ -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()) {
+        emailError = if (email.isEmpty()) context.getString(R.string.text_error_email_required) else null
-            Toast.makeText(context, "Email is required", Toast.LENGTH_SHORT).show()
+        passwordError = if (password.isEmpty()) context.getString(R.string.text_error_password_required) else null
-            return false
+        return emailError == null && passwordError == null
-        }
-        if (password.isEmpty()) {
-            Toast.makeText(context, "Password is required", Toast.LENGTH_SHORT).show()
-            return false
-        }
-        return true
     }
 
     fun onLogin() {
@@ -137,84 +136,97 @@ 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)
             }
-
+            Column(
-            Spacer(modifier = Modifier.padding(68.dp))
-            TextInputField(
                 modifier = Modifier
                     .fillMaxWidth()
+                    .weight(1f)
                     .padding(horizontal = 24.dp),
-                text = email,
+                horizontalAlignment = Alignment.CenterHorizontally,
-                onValueChange = {
-                    email = it
-                },
-                label = "What's your email?",
-                hint = "Enter your email"
-            )
-            Spacer(modifier = Modifier.padding(16.dp))
-            TextInputField(
-                modifier = Modifier
-                    .fillMaxWidth()
-                    .padding(horizontal = 24.dp),
-                text = password,
-                onValueChange = {
-                    password = it
-                },
-                password = true,
-                label = "What's your password?",
-                hint = "Enter your password"
-            )
-            Spacer(modifier = Modifier.height(32.dp))
-            Row(
-                verticalAlignment = Alignment.CenterVertically
             ) {
-                Checkbox(
+                Spacer(modifier = Modifier.padding(48.dp))
-                    checked = rememberMe,
+                TextInputField(
-                    onCheckedChange = {
-                        rememberMe = it
-                    },
-                    modifier = Modifier.padding(start = 24.dp),
-                    colors = CheckboxDefaults.colors(
-                        checkedColor = Color.Black
-                    ),
-                )
-                Text("Remember me", modifier = Modifier.padding(start = 4.dp))
-                Spacer(modifier = Modifier.weight(1f))
-                Text("Forgot password?", modifier = Modifier.padding(end = 24.dp))
-            }
-            Spacer(modifier = Modifier.height(64.dp))
-            ActionButton(
-                modifier = Modifier
-                    .width(345.dp)
-                    .height(48.dp),
-                text = "LET'S RIDE".uppercase(),
-                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(16.dp))
-            Row {
-                Box(
                     modifier = Modifier
-                        .size(96.dp)
+                        .fillMaxWidth(),
-                        .padding(16.dp)
+                    text = email,
-                        .border(2.dp, Color(0xFFEBEBEB))
+                    onValueChange = {
-                        .noRippleClickable {
+                        email = it
-                            // login with facebook
+                    },
-                            googleLogin()
+                    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(),
+                    text = password,
+                    onValueChange = {
+                        password = it
+                    },
+                    password = true,
+                    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
                 ) {
-                    Image(
+                    CompositionLocalProvider(LocalMinimumInteractiveComponentEnforcement provides false) {
-                        painter = painterResource(id = R.drawable.rider_pro_google),
+                        Checkbox(
-                        contentDescription = "Google",
+                            checked = rememberMe,
-                        modifier = Modifier.fillMaxSize()
+                            onCheckedChange = {
-                    )
+                                rememberMe = it
+                            },
+                            colors = CheckboxDefaults.colors(
+                                checkedColor = Color.Black
+                            ),
+                        )
+                        Text(
+                            stringResource(R.string.remember_me),
+                            modifier = Modifier.padding(start = 8.dp),
+                            fontSize = 12.sp
+                        )
+                        Spacer(modifier = Modifier.weight(1f))
+                        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 = stringResource(R.string.lets_ride_upper),
+                    backgroundImage = R.mipmap.rider_pro_signup_red_bg
+                ) {
+                    onLogin()
+                }
+
+                Spacer(modifier = Modifier.height(48.dp))
+                Text(stringResource(R.string.or_login_with), color = Color(0xFF999999))
+                Spacer(modifier = Modifier.height(16.dp))
+                Row {
+                    Box(
+                        modifier = Modifier
+                            .size(96.dp)
+                            .padding(16.dp)
+                            .border(2.dp, Color(0xFFEBEBEB))
+                            .noRippleClickable {
+                                // login with facebook
+                                googleLogin()
+                            }
+                    ) {
+                        Image(
+                            painter = painterResource(id = R.drawable.rider_pro_google),
+                            contentDescription = "Google",
+                            modifier = Modifier.fillMaxSize()
+                        )
+                    }
                 }
             }
+
         }
     }
 

app/src/main/res/values-zh/strings.xml

@@ -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>

app/src/main/res/values/strings.xml

@@ -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>