From 1935da7e72c96e87a1ff06e1b42fc8b7678ecd4d Mon Sep 17 00:00:00 2001 From: AllenTom Date: Mon, 30 Sep 2024 22:14:52 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E7=99=BB=E5=BD=95UI?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../riderpro/ui/account/ResetPassword.kt | 6 +- .../riderpro/ui/composables/ActionButton.kt | 46 ++-- .../riderpro/ui/composables/Checkbox.kt | 5 +- .../riderpro/ui/composables/TextInputField.kt | 25 +- .../riderpro/ui/index/tabs/profile/Profile.kt | 56 +++-- .../aiosman/riderpro/ui/login/emailsignup.kt | 12 +- .../com/aiosman/riderpro/ui/login/login.kt | 217 ++++++++++++++---- .../com/aiosman/riderpro/ui/login/userauth.kt | 34 ++- app/src/main/res/values-zh/strings.xml | 2 +- app/src/main/res/values/strings.xml | 2 +- 10 files changed, 289 insertions(+), 116 deletions(-) diff --git a/app/src/main/java/com/aiosman/riderpro/ui/account/ResetPassword.kt b/app/src/main/java/com/aiosman/riderpro/ui/account/ResetPassword.kt index 94086fa..cf638c2 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/account/ResetPassword.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/account/ResetPassword.kt @@ -145,10 +145,9 @@ fun ResetPasswordScreen() { TextInputField( text = username, onValueChange = { username = it }, - label = stringResource(R.string.login_email_label), hint = stringResource(R.string.text_hint_email), enabled = !isLoading, - error = usernameError + error = usernameError, ) Spacer(modifier = Modifier.height(72.dp)) if (isLoading) { @@ -159,7 +158,8 @@ fun ResetPasswordScreen() { .width(345.dp) .height(48.dp), text = stringResource(R.string.recover), - backgroundImage = R.mipmap.rider_pro_signup_red_bg + backgroundColor = Color(0xffda3832), + ) { resetPassword() } diff --git a/app/src/main/java/com/aiosman/riderpro/ui/composables/ActionButton.kt b/app/src/main/java/com/aiosman/riderpro/ui/composables/ActionButton.kt index 3167bce..eb103a7 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/composables/ActionButton.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/ActionButton.kt @@ -1,19 +1,21 @@ package com.aiosman.riderpro.ui.composables import androidx.annotation.DrawableRes -import androidx.compose.foundation.Image +import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip 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.text.style.TextAlign +import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import com.aiosman.riderpro.ui.modifiers.noRippleClickable @@ -21,28 +23,38 @@ import com.aiosman.riderpro.ui.modifiers.noRippleClickable fun ActionButton( modifier: Modifier, text: String, - color: Color = Color.White, - @DrawableRes backgroundImage: Int, + color: Color = Color.Black, + @DrawableRes backgroundImage: Int? = null, + backgroundColor: Color = Color(0xfff0f0f0), leading: @Composable (() -> Unit)? = null, + expandText: Boolean = false, + contentPadding: PaddingValues = PaddingValues(vertical = 16.dp), click: () -> Unit = {} ) { Box( - modifier = modifier.noRippleClickable { - click() - } + modifier = modifier + .clip(RoundedCornerShape(24.dp)) + .background(backgroundColor) + .padding(contentPadding) + .noRippleClickable { + click() + } ) { - Image( - painter = painterResource(id = backgroundImage), - contentDescription = "Rider Pro", - modifier = Modifier.fillMaxSize(), - contentScale = ContentScale.FillBounds - ) Row( modifier = Modifier.align(Alignment.Center), verticalAlignment = Alignment.CenterVertically ) { leading?.invoke() - Text(text, fontSize = 14.sp, color = color, fontWeight = FontWeight.W600, fontStyle = FontStyle.Italic) + Text( + text, + fontSize = 14.sp, + color = color, + fontWeight = FontWeight.W600, + modifier = Modifier.let { + if (expandText) it.weight(1f) else it + }, + textAlign = if (expandText) TextAlign.Center else TextAlign.Start + ) } } diff --git a/app/src/main/java/com/aiosman/riderpro/ui/composables/Checkbox.kt b/app/src/main/java/com/aiosman/riderpro/ui/composables/Checkbox.kt index a8de480..4573c52 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/composables/Checkbox.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/Checkbox.kt @@ -7,12 +7,14 @@ import androidx.compose.foundation.border import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size +import androidx.compose.foundation.shape.CircleShape import androidx.compose.material.Icon import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Check import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip import androidx.compose.ui.graphics.Color import androidx.compose.ui.unit.dp import com.aiosman.riderpro.ui.modifiers.noRippleClickable @@ -34,8 +36,9 @@ fun Checkbox( .noRippleClickable { onCheckedChange(!checked) } + .clip(CircleShape) .background(color = backgroundColor) - .border(width = borderWidth, color = borderColor) + .border(width = borderWidth, color = borderColor, shape = CircleShape) .padding(2.dp) ) { if (checked) { diff --git a/app/src/main/java/com/aiosman/riderpro/ui/composables/TextInputField.kt b/app/src/main/java/com/aiosman/riderpro/ui/composables/TextInputField.kt index 16cb1b8..875ed21 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/composables/TextInputField.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/TextInputField.kt @@ -6,13 +6,16 @@ import androidx.compose.animation.fadeIn import androidx.compose.animation.fadeOut import androidx.compose.foundation.Image import androidx.compose.foundation.background +import androidx.compose.foundation.border import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size +import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.text.BasicTextField import androidx.compose.foundation.text.KeyboardOptions import androidx.compose.material.icons.Icons @@ -25,6 +28,7 @@ import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip import androidx.compose.ui.focus.onFocusChanged import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.ColorFilter @@ -58,7 +62,16 @@ fun TextInputField( Spacer(modifier = Modifier.height(16.dp)) } Box( - contentAlignment = Alignment.CenterStart + contentAlignment = Alignment.CenterStart, + modifier = Modifier + .clip(RoundedCornerShape(24.dp)) + .background(Color(0xFFF7f7f7)) + .border( + width = 1.dp, + color = if (error == null) Color.Transparent else Color(0xFFE53935), + shape = RoundedCornerShape(24.dp) + ) + .padding(horizontal = 16.dp, vertical = 16.dp) ) { Row { BasicTextField( @@ -97,18 +110,10 @@ fun TextInputField( if (text.isEmpty()) { hint?.let { - Text(it, color = Color(0xFFCCCCCC), fontWeight = FontWeight.W600) + Text(it, color = Color(0xffdadada), fontWeight = FontWeight.W600) } } } - Spacer(modifier = Modifier.height(16.dp)) - Box( - modifier = Modifier - .fillMaxWidth() - .height(1.dp) - .background(if (isFocused) Color(0xff333333) else Color(0xFFF5F5F5)) - - ) Spacer(modifier = Modifier.height(8.dp)) Row( modifier = Modifier diff --git a/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/profile/Profile.kt b/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/profile/Profile.kt index a6cfed5..6a96dba 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/profile/Profile.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/profile/Profile.kt @@ -54,6 +54,7 @@ import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.alpha import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.shadow import androidx.compose.ui.geometry.Offset @@ -137,7 +138,7 @@ fun Profile( var headerBannerMaxHeight: Int = userHeight + bannerHeight val headerBannerMinHeight = 100 val speedFactor = 0.5f - var currentHeaderHeight by rememberSaveable{ mutableStateOf(headerBannerMaxHeight) } + var currentHeaderHeight by rememberSaveable { mutableStateOf(headerBannerMaxHeight) } var scrollState = rememberLazyListState() var gridScrollState = rememberLazyStaggeredGridState() var pagerState = rememberPagerState(pageCount = { 2 }) @@ -332,13 +333,15 @@ fun Profile( } } - // user info - Column( - modifier = Modifier - .fillMaxWidth() - .height(if (currentHeaderHeight.dp > bannerHeight.dp) userHeight.dp else currentHeaderHeight.dp) + Box( + modifier = Modifier.fillMaxWidth() ) { - if (currentHeaderHeight.dp > headerBannerMinHeight.dp) { + // user info + Column( + modifier = Modifier + .fillMaxWidth() + .height(if (currentHeaderHeight.dp > bannerHeight.dp) userHeight.dp else currentHeaderHeight.dp) + ) { Spacer(modifier = Modifier.height(16.dp)) // 个人信息 Box( @@ -371,14 +374,35 @@ fun Profile( } } + + // collapsed bar + + + } + val thresholdHeight = 200 // 设置阈值高度 + val startChangeHeight = headerBannerMinHeight + thresholdHeight + val alpha = if (currentHeaderHeight < startChangeHeight) { + ((currentHeaderHeight - headerBannerMinHeight).toFloat() / thresholdHeight.toFloat()).coerceIn( + 0f, + 1f + ) } else { + 1f // 高度大于阈值时,alpha 为 0 + } + Column( + modifier = Modifier + .fillMaxWidth() + // 保持在最低高度和当前高度之间 + .alpha(1 - alpha) + .background(Color(0xfff8f8f8)) + .padding(horizontal = 16.dp) + + + ) { StatusBarSpacer() + Row( - modifier = Modifier - .fillMaxWidth() - .height(headerBannerMinHeight.dp) -// .background(Color(0xfff8f8f8)) - .padding(horizontal = 16.dp), + modifier = Modifier.height(headerBannerMinHeight.dp), verticalAlignment = Alignment.CenterVertically ) { CustomAsyncImage( @@ -398,10 +422,10 @@ fun Profile( color = Color.Black ) } - + Spacer(modifier = Modifier.height(currentHeaderHeight.dp - headerBannerMinHeight.dp)) } - } + } Spacer(modifier = Modifier.height(16.dp)) Row( @@ -512,7 +536,9 @@ fun Profile( Box( modifier = Modifier .fillMaxWidth() - .height(300.dp) + .aspectRatio( + if (idx % 3 == 0) 1.5f else 1f + ) .clip(RoundedCornerShape(8.dp)) .noRippleClickable { navController.navigateToPost( diff --git a/app/src/main/java/com/aiosman/riderpro/ui/login/emailsignup.kt b/app/src/main/java/com/aiosman/riderpro/ui/login/emailsignup.kt index ea623f5..8e96109 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/login/emailsignup.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/login/emailsignup.kt @@ -1,7 +1,5 @@ package com.aiosman.riderpro.ui.login -import android.icu.util.Calendar -import android.icu.util.TimeZone import android.widget.Toast import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box @@ -28,7 +26,6 @@ import com.aiosman.riderpro.AppState import com.aiosman.riderpro.AppStore import com.aiosman.riderpro.ErrorCode import com.aiosman.riderpro.LocalNavController -import com.aiosman.riderpro.Messaging import com.aiosman.riderpro.R import com.aiosman.riderpro.data.AccountService import com.aiosman.riderpro.data.ServiceException @@ -41,7 +38,6 @@ import com.aiosman.riderpro.ui.composables.CheckboxWithLabel import com.aiosman.riderpro.ui.composables.PolicyCheckbox import com.aiosman.riderpro.ui.composables.StatusBarSpacer import com.aiosman.riderpro.ui.composables.TextInputField -import com.aiosman.riderpro.utils.Utils import kotlinx.coroutines.Dispatchers import kotlinx.coroutines.launch @@ -182,7 +178,7 @@ fun EmailSignupScreen() { .fillMaxWidth() .padding(top = 16.dp, start = 16.dp, end = 16.dp) ) { - NoticeScreenHeader(stringResource(R.string.sign_in_upper), moreIcon = false) + NoticeScreenHeader(stringResource(R.string.sign_up_upper), moreIcon = false) } Spacer(modifier = Modifier.padding(32.dp)) Column( @@ -198,7 +194,6 @@ fun EmailSignupScreen() { onValueChange = { email = it }, - label = stringResource(R.string.login_email_label), hint = stringResource(R.string.text_hint_email), error = emailError ) @@ -211,7 +206,6 @@ fun EmailSignupScreen() { password = it }, password = true, - label = stringResource(R.string.login_password_label), hint = stringResource(R.string.text_hint_password), error = passwordError ) @@ -224,7 +218,6 @@ fun EmailSignupScreen() { confirmPassword = it }, password = true, - label = stringResource(R.string.login_confirm_password_label), hint = stringResource(R.string.text_hint_confirm_password), error = confirmPasswordError ) @@ -279,7 +272,8 @@ fun EmailSignupScreen() { .width(345.dp) .height(48.dp), text = stringResource(R.string.lets_ride_upper), - backgroundImage = R.mipmap.rider_pro_signup_red_bg + backgroundColor = Color(0xffda3832), + color = Color.White ) { scope.launch(Dispatchers.IO) { registerUser() diff --git a/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt b/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt index 732b19d..1e98b82 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt @@ -1,104 +1,241 @@ package com.aiosman.riderpro.ui.login +import android.content.ContentValues.TAG +import android.util.Log +import android.widget.Toast import androidx.compose.foundation.Image -import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.WindowInsets +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.offset import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.width import androidx.compose.material3.Scaffold import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect +import androidx.compose.runtime.rememberCoroutineScope import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Brush +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.platform.LocalContext +import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp +import com.aiosman.riderpro.AppState +import com.aiosman.riderpro.AppStore import com.aiosman.riderpro.LocalNavController import com.aiosman.riderpro.R +import com.aiosman.riderpro.data.AccountServiceImpl +import com.aiosman.riderpro.data.ServiceException import com.aiosman.riderpro.ui.NavigationRoute import com.aiosman.riderpro.ui.composables.ActionButton +import com.aiosman.riderpro.ui.modifiers.noRippleClickable +import com.aiosman.riderpro.utils.GoogleLogin +import com.google.accompanist.systemuicontroller.SystemUiController +import com.google.accompanist.systemuicontroller.rememberSystemUiController +import kotlinx.coroutines.Dispatchers +import kotlinx.coroutines.launch @Composable fun LoginPage() { val navController = LocalNavController.current + val context = LocalContext.current + val coroutineScope = rememberCoroutineScope() + val accountService = AccountServiceImpl() + val statusBarController = rememberSystemUiController() LaunchedEffect(Unit) { -// navController.navigate(NavigationRoute.Index.route) + statusBarController.setStatusBarColor(Color.Transparent, darkIcons = true) + } - Scaffold { - it + + + fun googleLogin() { + coroutineScope.launch { + try { + GoogleLogin(context) { + coroutineScope.launch { + try { + accountService.regiterUserWithGoogleAccount(it) + } catch (e: Exception) { + Log.e(TAG, "Failed to register with google", e) + return@launch + } + // 获取用户信息 + // 获取 token + val authResp = accountService.loginUserWithGoogle(it) + if (authResp.token != null) { + coroutineScope.launch(Dispatchers.Main) { + Toast.makeText( + context, + "Successfully registered", + Toast.LENGTH_SHORT + ) + .show() + } + } + AppStore.apply { + token = authResp.token + this.rememberMe = true + saveData() + } + // 获取token 信息 + try { + AppState.initWithAccount(coroutineScope, context) + } catch (e: Exception) { + Log.e(TAG, "Failed to init with account", e) + } catch (e: ServiceException) { + coroutineScope.launch(Dispatchers.Main) { + Toast.makeText(context, "Failed to get account", Toast.LENGTH_SHORT) + .show() + } + } + coroutineScope.launch(Dispatchers.Main) { + navController.navigate(NavigationRoute.Index.route) { + popUpTo(NavigationRoute.Login.route) { inclusive = true } + } + } + } + + } + } catch (e: Exception) { + Toast.makeText(context, e.message, Toast.LENGTH_SHORT).show() + } + + } + } + Box( + modifier = Modifier.fillMaxSize().background(Color.White) + ) { + // bg image Box( - modifier = Modifier.fillMaxSize() + modifier = Modifier.fillMaxWidth().height(900.dp).offset( + y = (-72).dp + ), ) { + Image( + painter = painterResource(id = R.mipmap.rider_pro_login_bg), + contentDescription = "Login Background", + modifier = Modifier.fillMaxWidth().fillMaxHeight(), + contentScale = androidx.compose.ui.layout.ContentScale.Crop, + ) + Box( + modifier = Modifier + .fillMaxWidth() + .fillMaxHeight() + .background(Color.White.copy(alpha = 0.8f)), + contentAlignment = Alignment.BottomCenter + ) { + Box( + modifier = Modifier + .fillMaxWidth() + .height(300.dp) + .background( + Brush.verticalGradient( + colors = listOf( + Color.Transparent, + Color.White + ), + startY = 0f, + endY = 300f + ) + ) + ) + } + } + + + Column( + modifier = Modifier + .fillMaxSize() + .padding(horizontal = 24.dp), + ) { + Spacer(modifier = Modifier.weight(1f)) // to bottom Box( contentAlignment = Alignment.TopCenter, - modifier = Modifier.padding(top = 211.dp) ) { Column( horizontalAlignment = Alignment.CenterHorizontally, modifier = Modifier.fillMaxWidth() ) { Image( - painter = painterResource(id = R.mipmap.rider_pro_logo), + painter = painterResource(id = R.mipmap.rider_pro_color_logo), contentDescription = "Rider Pro", modifier = Modifier - .width(108.dp) - .height(45.dp) + .size(48.dp) ) Spacer(modifier = Modifier.height(32.dp)) Text( "Connecting Riders".uppercase(), fontSize = 28.sp, - fontWeight = FontWeight.Bold + fontWeight = FontWeight.W600 ) - Text("Worldwide".uppercase(), fontSize = 28.sp, fontWeight = FontWeight.Bold) + Text("Worldwide".uppercase(), fontSize = 28.sp, fontWeight = FontWeight.W600) } } - Box( - modifier = Modifier - .align(Alignment.BottomCenter) - .padding(bottom = 82.dp + 162.dp) + Spacer(modifier = Modifier.height(32.dp)) + ActionButton( + modifier = Modifier.fillMaxWidth(), + text = stringResource(R.string.sign_up_upper), + color = Color.White, + backgroundColor = Color(0xffda3832) ) { - Row( - modifier = Modifier.fillMaxWidth(), - horizontalArrangement = Arrangement.Center - ) { - ActionButton( - modifier = Modifier - .width(162.dp) - .height(48.dp), - text = stringResource(R.string.login_upper), - backgroundImage = R.mipmap.rider_pro_grey_bg_big - ) { + navController.navigate( + NavigationRoute.EmailSignUp.route, + ) + } + Spacer(modifier = Modifier.height(16.dp)) + ActionButton( + modifier = Modifier.fillMaxWidth(), + text = stringResource(R.string.sign_in_with_google), + color = Color.Black, + leading = { + Image( + painter = painterResource(id = R.drawable.rider_pro_google), + contentDescription = "Google", + modifier = Modifier.size(36.dp) + ) + }, + expandText = true, + contentPadding = PaddingValues(vertical = 8.dp, horizontal = 8.dp) + ) { + googleLogin() + } + Spacer(modifier = Modifier.height(32.dp)) + Box( + contentAlignment = Alignment.Center, + modifier = Modifier.fillMaxWidth() + ) { + Text( + stringResource(R.string.login_upper), + fontSize = 16.sp, + fontWeight = FontWeight.W600, + color = Color(0xff333333), + modifier = Modifier.noRippleClickable { navController.navigate( NavigationRoute.UserAuth.route, ) } - ActionButton( - modifier = Modifier - .width(162.dp) - .height(48.dp), - text = stringResource(R.string.sign_in_upper), - backgroundImage = R.mipmap.rider_pro_red_bg_big - ){ - navController.navigate( - NavigationRoute.SignUp.route, - ) - } - } + ) } + Spacer(modifier = Modifier.height(120.dp)) } - } + + } diff --git a/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt b/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt index ac25526..a1be3c1 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt @@ -8,6 +8,7 @@ import androidx.compose.foundation.background import androidx.compose.foundation.border 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.Spacer import androidx.compose.foundation.layout.fillMaxSize @@ -164,7 +165,6 @@ fun UserAuthScreen() { onValueChange = { email = it }, - label = stringResource(R.string.login_email_label), hint = stringResource(R.string.text_hint_email), error = emailError ) @@ -177,7 +177,6 @@ fun UserAuthScreen() { password = it }, password = true, - label = stringResource(R.string.login_password_label), hint = stringResource(R.string.text_hint_password), error = passwordError ) @@ -229,34 +228,31 @@ fun UserAuthScreen() { } Spacer(modifier = Modifier.height(64.dp)) ActionButton( - modifier = Modifier - .width(345.dp) - .height(48.dp), + modifier = Modifier.fillMaxWidth(), text = stringResource(R.string.lets_ride_upper), - backgroundImage = R.mipmap.rider_pro_signup_red_bg + backgroundColor = Color(0xffda3832), + color = Color.White ) { 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() - } - ) { + ActionButton( + modifier = Modifier.fillMaxWidth(), + text = stringResource(R.string.sign_in_with_google), + color = Color.Black, + leading = { Image( painter = painterResource(id = R.drawable.rider_pro_google), contentDescription = "Google", - modifier = Modifier.fillMaxSize() + modifier = Modifier.size(36.dp) ) - } + }, + expandText = true, + contentPadding = PaddingValues(vertical = 8.dp, horizontal = 8.dp) + ){ + googleLogin() } } diff --git a/app/src/main/res/values-zh/strings.xml b/app/src/main/res/values-zh/strings.xml index f06b62b..f196a46 100644 --- a/app/src/main/res/values-zh/strings.xml +++ b/app/src/main/res/values-zh/strings.xml @@ -29,7 +29,7 @@ 密码是必填项 输入邮箱 输入密码 - 注册 + 注册 使用邮箱注册 使用 Google 账号登录 返回 diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index 47c59c3..f5fe4bd 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -28,7 +28,7 @@ Password is required Enter your email Enter your password - SIGN IN + SIGN UP CONTINUE WITH EMAIL CONTINUE WITH GOOGLE BACK