|
|
@ -1,5 +1,6 @@ |
|
|
|
package com.whitefish.ring.ui.guide |
|
|
|
|
|
|
|
import androidx.compose.foundation.Image |
|
|
|
import androidx.compose.foundation.background |
|
|
|
import androidx.compose.foundation.layout.* |
|
|
|
import androidx.compose.foundation.shape.RoundedCornerShape |
|
|
@ -8,11 +9,16 @@ import androidx.compose.runtime.* |
|
|
|
import androidx.compose.ui.Alignment |
|
|
|
import androidx.compose.ui.Modifier |
|
|
|
import androidx.compose.ui.graphics.Color |
|
|
|
import androidx.compose.ui.layout.ContentScale |
|
|
|
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 org.jetbrains.compose.resources.painterResource |
|
|
|
import org.jetbrains.compose.ui.tooling.preview.Preview |
|
|
|
import ring.shared.generated.resources.Res |
|
|
|
import ring.shared.generated.resources.bg_login |
|
|
|
import ring.shared.generated.resources.bg_login_fullscreen |
|
|
|
|
|
|
|
@Composable |
|
|
|
fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) -> Unit = { _, _ -> }) { |
|
|
@ -26,51 +32,38 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) |
|
|
|
.fillMaxSize() |
|
|
|
.background(Color(0xFFF5F5F5)), |
|
|
|
) { |
|
|
|
Image(painterResource(Res.drawable.bg_login_fullscreen),contentDescription = null, modifier = Modifier.fillMaxSize(), contentScale = ContentScale.Crop) |
|
|
|
|
|
|
|
Image(painterResource(Res.drawable.bg_login),contentDescription = null, modifier = Modifier.fillMaxWidth().height(375.dp), contentScale = ContentScale.Crop) |
|
|
|
|
|
|
|
Column( |
|
|
|
modifier = |
|
|
|
Modifier |
|
|
|
.fillMaxSize() |
|
|
|
.padding(horizontal = 24.dp), |
|
|
|
.padding(horizontal = 23.dp), |
|
|
|
horizontalAlignment = Alignment.CenterHorizontally, |
|
|
|
) { |
|
|
|
Spacer(modifier = Modifier.height(120.dp)) |
|
|
|
|
|
|
|
// 戒指图片占位符 |
|
|
|
Box( |
|
|
|
modifier = |
|
|
|
Modifier |
|
|
|
.size(160.dp) |
|
|
|
.background( |
|
|
|
Color(0xFFE5E5E5), |
|
|
|
RoundedCornerShape(80.dp), |
|
|
|
), |
|
|
|
contentAlignment = Alignment.Center, |
|
|
|
) { |
|
|
|
Text( |
|
|
|
text = "💍", |
|
|
|
fontSize = 64.sp, |
|
|
|
) |
|
|
|
} |
|
|
|
|
|
|
|
Spacer(modifier = Modifier.height(40.dp)) |
|
|
|
Spacer(modifier = Modifier.height(210.dp)) |
|
|
|
|
|
|
|
// 欢迎标题 |
|
|
|
Column( |
|
|
|
horizontalAlignment = Alignment.CenterHorizontally, |
|
|
|
modifier = Modifier.fillMaxWidth(), |
|
|
|
horizontalAlignment = Alignment.Start, |
|
|
|
) { |
|
|
|
Text( |
|
|
|
text = "Hi,", |
|
|
|
fontSize = 28.sp, |
|
|
|
fontSize = 32.sp, |
|
|
|
fontWeight = FontWeight.Medium, |
|
|
|
color = Color(0xFF333333), |
|
|
|
color = Color(0xFF484848), |
|
|
|
textAlign = TextAlign.Center, |
|
|
|
) |
|
|
|
|
|
|
|
Text( |
|
|
|
text = "欢迎来到Acti", |
|
|
|
fontSize = 28.sp, |
|
|
|
fontSize = 32.sp, |
|
|
|
fontWeight = FontWeight.Medium, |
|
|
|
color = Color(0xFF333333), |
|
|
|
color = Color(0xFF484848), |
|
|
|
textAlign = TextAlign.Center, |
|
|
|
) |
|
|
|
} |
|
|
@ -89,7 +82,7 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) |
|
|
|
modifier = Modifier.padding(bottom = 8.dp), |
|
|
|
) |
|
|
|
|
|
|
|
OutlinedTextField( |
|
|
|
TextField( |
|
|
|
value = phoneNumber, |
|
|
|
onValueChange = { phoneNumber = it }, |
|
|
|
placeholder = { |
|
|
@ -98,15 +91,16 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) |
|
|
|
color = Color(0xFF999999), |
|
|
|
) |
|
|
|
}, |
|
|
|
modifier = Modifier.fillMaxWidth(), |
|
|
|
shape = RoundedCornerShape(12.dp), |
|
|
|
colors = |
|
|
|
OutlinedTextFieldDefaults.colors( |
|
|
|
focusedBorderColor = Color(0xFF007AFF), |
|
|
|
unfocusedBorderColor = Color(0xFFE5E5E5), |
|
|
|
focusedContainerColor = Color.White, |
|
|
|
unfocusedContainerColor = Color.White, |
|
|
|
), |
|
|
|
TextFieldDefaults.colors().copy(focusedContainerColor = Color.Transparent, unfocusedContainerColor = Color.Transparent), |
|
|
|
modifier = Modifier.fillMaxWidth(), |
|
|
|
// colors = |
|
|
|
// TextField.colors( |
|
|
|
// focusedBorderColor = Color.White, |
|
|
|
// unfocusedBorderColor = Color.White, |
|
|
|
// focusedContainerColor = Color.White, |
|
|
|
// unfocusedContainerColor = Color.White, |
|
|
|
// ), |
|
|
|
singleLine = true, |
|
|
|
) |
|
|
|
} |
|
|
@ -129,42 +123,38 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) |
|
|
|
modifier = Modifier.fillMaxWidth(), |
|
|
|
verticalAlignment = Alignment.CenterVertically, |
|
|
|
) { |
|
|
|
OutlinedTextField( |
|
|
|
value = verificationCode, |
|
|
|
onValueChange = { verificationCode = it }, |
|
|
|
placeholder = { |
|
|
|
Text( |
|
|
|
text = "请输入验证码", |
|
|
|
color = Color(0xFF999999), |
|
|
|
) |
|
|
|
}, |
|
|
|
modifier = Modifier.weight(1f), |
|
|
|
shape = RoundedCornerShape(12.dp), |
|
|
|
colors = |
|
|
|
OutlinedTextFieldDefaults.colors( |
|
|
|
focusedBorderColor = Color(0xFF007AFF), |
|
|
|
unfocusedBorderColor = Color(0xFFE5E5E5), |
|
|
|
focusedContainerColor = Color.White, |
|
|
|
unfocusedContainerColor = Color.White, |
|
|
|
), |
|
|
|
singleLine = true, |
|
|
|
) |
|
|
|
|
|
|
|
Spacer(modifier = Modifier.width(12.dp)) |
|
|
|
|
|
|
|
TextButton( |
|
|
|
onClick = { |
|
|
|
if (phoneNumber.isNotEmpty()) { |
|
|
|
isCodeSent = true |
|
|
|
} |
|
|
|
}, |
|
|
|
enabled = phoneNumber.isNotEmpty(), |
|
|
|
) { |
|
|
|
Text( |
|
|
|
text = if (isCodeSent) "重新发送验证码" else "获取验证码", |
|
|
|
fontSize = 14.sp, |
|
|
|
color = if (phoneNumber.isNotEmpty()) Color(0xFF007AFF) else Color(0xFF999999), |
|
|
|
Box{ |
|
|
|
TextField( |
|
|
|
value = verificationCode, |
|
|
|
onValueChange = { verificationCode = it }, |
|
|
|
placeholder = { |
|
|
|
Text( |
|
|
|
text = "请输入验证码", |
|
|
|
color = Color(0xFF999999), |
|
|
|
) |
|
|
|
}, |
|
|
|
colors = |
|
|
|
TextFieldDefaults.colors().copy(focusedContainerColor = Color.Transparent, unfocusedContainerColor = Color.Transparent), |
|
|
|
modifier = Modifier.fillMaxWidth(), |
|
|
|
singleLine = true, |
|
|
|
) |
|
|
|
|
|
|
|
Row(modifier = Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.End) { |
|
|
|
TextButton( |
|
|
|
onClick = { |
|
|
|
if (phoneNumber.isNotEmpty()) { |
|
|
|
isCodeSent = true |
|
|
|
} |
|
|
|
}, |
|
|
|
enabled = phoneNumber.isNotEmpty(), |
|
|
|
) { |
|
|
|
Text( |
|
|
|
text = if (isCodeSent) "重新发送验证码" else "获取验证码", |
|
|
|
fontSize = 14.sp, |
|
|
|
color = if (phoneNumber.isNotEmpty()) Color(0xFF007AFF) else Color(0xFF999999), |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
@ -189,13 +179,14 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) |
|
|
|
modifier = |
|
|
|
Modifier |
|
|
|
.fillMaxWidth() |
|
|
|
.height(56.dp), |
|
|
|
shape = RoundedCornerShape(28.dp), |
|
|
|
.height(51.dp) |
|
|
|
.padding(horizontal = 13.dp), |
|
|
|
shape = RoundedCornerShape(30.dp), |
|
|
|
colors = |
|
|
|
ButtonDefaults.buttonColors( |
|
|
|
containerColor = |
|
|
|
if (phoneNumber.isNotEmpty() && verificationCode.isNotEmpty()) { |
|
|
|
Color(0xFF007AFF) |
|
|
|
Color(0x8098999B) |
|
|
|
} else { |
|
|
|
Color(0xFFCCCCCC) |
|
|
|
}, |
|
|
@ -205,6 +196,7 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) |
|
|
|
Text( |
|
|
|
text = "登录", |
|
|
|
fontSize = 18.sp, |
|
|
|
color = Color.Black, |
|
|
|
fontWeight = FontWeight.Medium, |
|
|
|
) |
|
|
|
} |
|
|
|