Browse Source

fix: device guide layout

dev_ios
AnranYus 3 weeks ago
parent
commit
0d38f76298
  1. BIN
      shared/src/commonMain/composeResources/drawable/bg_login.png
  2. BIN
      shared/src/commonMain/composeResources/drawable/bg_login_fullscreen.png
  3. BIN
      shared/src/commonMain/composeResources/drawable/bg_userinfo_guide.png
  4. BIN
      shared/src/commonMain/composeResources/drawable/bg_welcome.png
  5. BIN
      shared/src/commonMain/composeResources/drawable/ic_arrow_right.png
  6. BIN
      shared/src/commonMain/composeResources/drawable/ic_connect_tip.png
  7. BIN
      shared/src/commonMain/composeResources/drawable/ic_domain_hand_left.png
  8. BIN
      shared/src/commonMain/composeResources/drawable/ic_domain_hand_right.png
  9. BIN
      shared/src/commonMain/composeResources/drawable/ic_uapp_checked.png
  10. BIN
      shared/src/commonMain/composeResources/drawable/ic_uapp_uncheck.png
  11. BIN
      shared/src/commonMain/composeResources/drawable/ic_unuse_hand_left.png
  12. BIN
      shared/src/commonMain/composeResources/drawable/ic_unuse_hand_right.png
  13. BIN
      shared/src/commonMain/composeResources/drawable/ic_use_hand_left.png
  14. BIN
      shared/src/commonMain/composeResources/drawable/ic_use_hand_right.png
  15. 114
      shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/ConnectionGuideScreen.kt
  16. 157
      shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/DominantHandScreen.kt
  17. 59
      shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/PersonalInfoScreen.kt
  18. 136
      shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/RegisterScreen.kt
  19. 139
      shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/WearingFingerScreen.kt
  20. 130
      shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/WelcomeScreen.kt

BIN
shared/src/commonMain/composeResources/drawable/bg_login.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

BIN
shared/src/commonMain/composeResources/drawable/bg_login_fullscreen.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.9 KiB

BIN
shared/src/commonMain/composeResources/drawable/bg_userinfo_guide.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 116 KiB

BIN
shared/src/commonMain/composeResources/drawable/bg_welcome.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 914 KiB

BIN
shared/src/commonMain/composeResources/drawable/ic_arrow_right.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 179 B

BIN
shared/src/commonMain/composeResources/drawable/ic_connect_tip.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 367 KiB

BIN
shared/src/commonMain/composeResources/drawable/ic_domain_hand_left.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

BIN
shared/src/commonMain/composeResources/drawable/ic_domain_hand_right.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

BIN
shared/src/commonMain/composeResources/drawable/ic_uapp_checked.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 564 B

BIN
shared/src/commonMain/composeResources/drawable/ic_uapp_uncheck.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 520 B

BIN
shared/src/commonMain/composeResources/drawable/ic_unuse_hand_left.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.4 KiB

BIN
shared/src/commonMain/composeResources/drawable/ic_unuse_hand_right.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.3 KiB

BIN
shared/src/commonMain/composeResources/drawable/ic_use_hand_left.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.5 KiB

BIN
shared/src/commonMain/composeResources/drawable/ic_use_hand_right.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.4 KiB

114
shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/ConnectionGuideScreen.kt

@ -1,5 +1,6 @@
package com.whitefish.ring.ui.guide package com.whitefish.ring.ui.guide
import androidx.compose.foundation.Image
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.layout.* import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
@ -8,11 +9,16 @@ import androidx.compose.runtime.*
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import org.jetbrains.compose.resources.painterResource
import org.jetbrains.compose.ui.tooling.preview.Preview import org.jetbrains.compose.ui.tooling.preview.Preview
import ring.shared.generated.resources.Res
import ring.shared.generated.resources.bg_userinfo_guide
import ring.shared.generated.resources.ic_connect_tip
@Composable @Composable
fun ConnectionGuideScreen( fun ConnectionGuideScreen(
@ -23,116 +29,74 @@ fun ConnectionGuideScreen(
.fillMaxSize() .fillMaxSize()
.background(Color(0xFFF5F5F5)) .background(Color(0xFFF5F5F5))
) { ) {
Image(painterResource(Res.drawable.bg_userinfo_guide),contentDescription = null, modifier = Modifier.fillMaxSize())
Column( Column(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxSize(),
.padding(horizontal = 24.dp),
horizontalAlignment = Alignment.CenterHorizontally horizontalAlignment = Alignment.CenterHorizontally
) { ) {
Spacer(modifier = Modifier.height(80.dp)) Spacer(modifier = Modifier.height(62.dp))
// 标题 // 标题
Text( Text(
text = "连接您的Acti戒指", text = "连接您的Acti戒指",
fontSize = 24.sp, fontSize = 24.sp,
fontWeight = FontWeight.Medium, fontWeight = FontWeight.Medium,
color = Color(0xFF333333), color = Color(0xFF484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) )
Spacer(modifier = Modifier.height(40.dp)) Spacer(modifier = Modifier.height(22.dp))
// 说明文字 // 说明文字
Text( Text(
text = "将您的戒指连接到充电器,并继续下一步。请确保您的手机已启用蓝牙功能。", text = "将您的戒指连接到充电器,并继续下一步。请确保您的手机已启用蓝牙功能。",
fontSize = 16.sp, fontSize = 20.sp,
color = Color(0xFF666666), color = Color(0xff484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
lineHeight = 24.sp, lineHeight = 24.sp,
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.padding(horizontal = 16.dp) .padding(horizontal = 44.dp)
) )
Spacer(modifier = Modifier.height(60.dp))
// 戒指和充电器图片占位符
Box(
modifier = Modifier
.size(280.dp)
.background(
Color.White,
RoundedCornerShape(20.dp)
),
contentAlignment = Alignment.Center
) {
Column(
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
// 戒指图标
Text(
text = "💍",
fontSize = 80.sp
)
Spacer(modifier = Modifier.height(20.dp))
// 连接线
Box(
modifier = Modifier
.width(60.dp)
.height(4.dp)
.background(
Color(0xFF007AFF),
RoundedCornerShape(2.dp)
)
)
Spacer(modifier = Modifier.height(20.dp))
// 充电器图标
Box(
modifier = Modifier
.size(80.dp)
.background(
Color(0xFF333333),
RoundedCornerShape(40.dp)
),
contentAlignment = Alignment.Center
) {
Text(
text = "",
fontSize = 40.sp,
color = Color.White
)
}
}
}
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.weight(1f))
Image(
painterResource(Res.drawable.ic_connect_tip),
contentDescription = null,
modifier = Modifier.fillMaxWidth().height(375.dp),
contentScale = ContentScale.Crop
)
Spacer(modifier = Modifier.height(53.dp))
// 下一步按钮 // 下一步按钮
Button( Button(
onClick = onNextClick, onClick = onNextClick,
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.height(56.dp), .height(51.dp)
shape = RoundedCornerShape(28.dp), .padding(horizontal = 36.dp),
shape = RoundedCornerShape(30.dp),
colors = ButtonDefaults.buttonColors( colors = ButtonDefaults.buttonColors(
containerColor = Color(0xFF007AFF), containerColor = Color(0x8098999B),
contentColor = Color.White contentColor = Color.White
) )
) { ) {
Text( Text(
text = "下一步", text = "下一步",
fontSize = 18.sp, fontSize = 18.sp,
fontWeight = FontWeight.Medium fontWeight = FontWeight.Medium,
color = Color.Black
) )
} }
Spacer(modifier = Modifier.height(40.dp)) Spacer(modifier = Modifier.height(53.dp))
} }
} }
} }

157
shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/DominantHandScreen.kt

@ -1,20 +1,43 @@
package com.whitefish.ring.ui.guide package com.whitefish.ring.ui.guide
import androidx.compose.foundation.Image
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.* import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Arrangement
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.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.* import androidx.compose.material3.Button
import androidx.compose.runtime.* import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.Card
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import org.jetbrains.compose.resources.painterResource
import org.jetbrains.compose.ui.tooling.preview.Preview import org.jetbrains.compose.ui.tooling.preview.Preview
import ring.shared.generated.resources.Res
import ring.shared.generated.resources.bg_userinfo_guide
import ring.shared.generated.resources.ic_domain_hand_left
import ring.shared.generated.resources.ic_domain_hand_right
@Composable @Composable
fun DominantHandScreen( fun DominantHandScreen(
@ -22,7 +45,8 @@ fun DominantHandScreen(
onHandSelected: (Hand) -> Unit = {} onHandSelected: (Hand) -> Unit = {}
) { ) {
var selectedHand by remember { mutableStateOf<Hand?>(null) } var selectedHand by remember { mutableStateOf<Hand?>(null) }
Image(painterResource(Res.drawable.bg_userinfo_guide),contentDescription = null, modifier = Modifier.fillMaxSize())
Box( Box(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxSize()
@ -35,30 +59,30 @@ fun DominantHandScreen(
horizontalAlignment = Alignment.CenterHorizontally horizontalAlignment = Alignment.CenterHorizontally
) { ) {
Spacer(modifier = Modifier.height(80.dp)) Spacer(modifier = Modifier.height(80.dp))
// 标题 // 标题
Text( Text(
text = "惯用手", text = "惯用手",
fontSize = 24.sp, fontSize = 24.sp,
fontWeight = FontWeight.Medium, fontWeight = FontWeight.Medium,
color = Color(0xFF333333), color = Color(0xFF333333),
textAlign = TextAlign.Center, textAlign = TextAlign.Start,
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) )
Spacer(modifier = Modifier.height(16.dp)) Spacer(modifier = Modifier.height(16.dp))
// 副标题 // 副标题
Text( Text(
text = "请选择您的惯用手", text = "请选择您的惯用手",
fontSize = 16.sp, fontSize = 12.sp,
color = Color(0xFF666666), color = Color(0xFF484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Start,
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) )
Spacer(modifier = Modifier.height(80.dp)) Spacer(modifier = Modifier.height(80.dp))
// 选择区域 // 选择区域
Row( Row(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
@ -74,7 +98,7 @@ fun DominantHandScreen(
}, },
modifier = Modifier.weight(1f) modifier = Modifier.weight(1f)
) )
// 右手选项 // 右手选项
HandOptionCard( HandOptionCard(
hand = Hand.RIGHT, hand = Hand.RIGHT,
@ -86,29 +110,32 @@ fun DominantHandScreen(
modifier = Modifier.weight(1f) modifier = Modifier.weight(1f)
) )
} }
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.weight(1f))
// 下一步按钮 // 下一步按钮
Button( Button(
onClick = onNextClick, onClick = onNextClick,
enabled = selectedHand != null, enabled = selectedHand != null,
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.padding(horizontal = 12.dp)
.height(56.dp), .height(56.dp),
shape = RoundedCornerShape(28.dp), shape = RoundedCornerShape(28.dp),
colors = ButtonDefaults.buttonColors( colors = ButtonDefaults.buttonColors(
containerColor = if (selectedHand != null) Color(0xFF007AFF) else Color(0xFFCCCCCC), containerColor = if (selectedHand != null) Color(0x8098999B) else Color(
contentColor = Color.White 0xFFCCCCCC
),
contentColor = Color.Black
) )
) { ) {
Text( Text(
text = "下一步", text = "完成",
fontSize = 18.sp, fontSize = 16.sp,
fontWeight = FontWeight.Medium fontWeight = FontWeight.Medium
) )
} }
Spacer(modifier = Modifier.height(40.dp)) Spacer(modifier = Modifier.height(40.dp))
} }
} }
@ -123,63 +150,53 @@ private fun HandOptionCard(
) { ) {
Card( Card(
modifier = modifier modifier = modifier
.height(200.dp) .clickable(
.clickable { onClick() }, indication = null,
shape = RoundedCornerShape(20.dp), interactionSource = remember { MutableInteractionSource() }
colors = CardDefaults.cardColors( ) { onClick() },
containerColor = if (isSelected) Color(0xFFE3F2FD) else Color.White colors = CardDefaults.cardColors().copy(containerColor = Color.Transparent),
),
elevation = CardDefaults.cardElevation( elevation = CardDefaults.cardElevation(
defaultElevation = if (isSelected) 8.dp else 4.dp defaultElevation = 0.dp
) )
) { ) {
Box( Card(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxWidth()
.then( .height(208.dp)
if (isSelected) { .clip(RoundedCornerShape(20.dp)),
Modifier.border( colors = CardDefaults.cardColors()
width = 2.dp, .copy(containerColor = if (isSelected) Color(0xE1484848) else Color(0x41484848)),
color = Color(0xFF007AFF),
shape = RoundedCornerShape(20.dp)
)
} else {
Modifier
}
),
contentAlignment = Alignment.Center
) { ) {
Column( Spacer(Modifier.weight(1f))
horizontalAlignment = Alignment.CenterHorizontally, if (hand == Hand.LEFT) {
verticalArrangement = Arrangement.Center Image(
) { painterResource(Res.drawable.ic_domain_hand_left),
// 手部图标占位符 contentDescription = null,
Box( modifier = Modifier.align(
modifier = Modifier Alignment.CenterHorizontally
.size(100.dp) )
.background( )
if (isSelected) Color(0xFF007AFF) else Color(0xFFE5E5E5), } else {
RoundedCornerShape(50.dp) Image(
), painterResource(Res.drawable.ic_domain_hand_right),
contentAlignment = Alignment.Center contentDescription = null,
) { modifier = Modifier.align(
Text( Alignment.CenterHorizontally
text = if (hand == Hand.LEFT) "" else "🤚",
fontSize = 48.sp,
color = if (isSelected) Color.White else Color(0xFF666666)
) )
}
Spacer(modifier = Modifier.height(20.dp))
Text(
text = if (hand == Hand.LEFT) "左手" else "右手",
fontSize = 18.sp,
fontWeight = FontWeight.Medium,
color = if (isSelected) Color(0xFF007AFF) else Color(0xFF333333)
) )
} }
Spacer(Modifier.weight(1f))
} }
Text(
if (hand == Hand.LEFT) "左手" else "右手",
modifier = Modifier
.fillMaxWidth()
.padding(top = 8.dp),
textAlign = TextAlign.Center,
fontSize = 16.sp,
fontWeight = FontWeight.Medium,
)
} }
} }

59
shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/PersonalInfoScreen.kt

@ -1,5 +1,6 @@
package com.whitefish.ring.ui.guide package com.whitefish.ring.ui.guide
import androidx.compose.foundation.Image
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.* import androidx.compose.foundation.layout.*
@ -13,7 +14,11 @@ import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import org.jetbrains.compose.resources.painterResource
import org.jetbrains.compose.ui.tooling.preview.Preview import org.jetbrains.compose.ui.tooling.preview.Preview
import ring.shared.generated.resources.Res
import ring.shared.generated.resources.ic_arrow_right
import ring.shared.generated.resources.bg_userinfo_guide
data class PersonalInfo( data class PersonalInfo(
val gender: String = "", val gender: String = "",
@ -29,12 +34,13 @@ fun PersonalInfoScreen(
onHeightClick: () -> Unit = {} onHeightClick: () -> Unit = {}
) { ) {
var personalInfo by remember { mutableStateOf(PersonalInfo()) } var personalInfo by remember { mutableStateOf(PersonalInfo()) }
Box( Box(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxSize()
.background(Color(0xFFF5F5F5))
) { ) {
Image(painterResource(Res.drawable.bg_userinfo_guide),contentDescription = null, modifier = Modifier.fillMaxSize())
Column( Column(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxSize()
@ -47,8 +53,8 @@ fun PersonalInfoScreen(
text = "个人信息完善", text = "个人信息完善",
fontSize = 24.sp, fontSize = 24.sp,
fontWeight = FontWeight.Medium, fontWeight = FontWeight.Medium,
color = Color(0xFF333333), color = Color(0xFF484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Start,
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) )
@ -58,12 +64,12 @@ fun PersonalInfoScreen(
Text( Text(
text = "完善您的个人信息以便更好的服务", text = "完善您的个人信息以便更好的服务",
fontSize = 16.sp, fontSize = 16.sp,
color = Color(0xFF666666), color = Color(0xFF484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Start,
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) )
Spacer(modifier = Modifier.height(60.dp)) Spacer(modifier = Modifier.height(122.dp))
// 性别选项 // 性别选项
PersonalInfoItem( PersonalInfoItem(
@ -97,11 +103,12 @@ fun PersonalInfoScreen(
onClick = onNextClick, onClick = onNextClick,
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.height(56.dp), .padding(horizontal = 12.dp)
shape = RoundedCornerShape(28.dp), .height(51.dp),
shape = RoundedCornerShape(30.dp),
colors = ButtonDefaults.buttonColors( colors = ButtonDefaults.buttonColors(
containerColor = Color(0xFF007AFF), containerColor = Color(0xff98999b),
contentColor = Color.White contentColor = Color.Black
) )
) { ) {
Text( Text(
@ -126,18 +133,15 @@ private fun PersonalInfoItem(
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.clickable { onClick() }, .clickable { onClick() },
shape = RoundedCornerShape(16.dp), shape = RoundedCornerShape(0.dp),
colors = CardDefaults.cardColors( colors = CardDefaults.cardColors(
containerColor = Color.White containerColor = Color.Transparent
), ),
elevation = CardDefaults.cardElevation(
defaultElevation = 2.dp
)
) { ) {
Row( Row(
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.padding(horizontal = 20.dp, vertical = 20.dp), .padding(vertical = 12.dp),
verticalAlignment = Alignment.CenterVertically verticalAlignment = Alignment.CenterVertically
) { ) {
Text( Text(
@ -156,14 +160,21 @@ private fun PersonalInfoItem(
modifier = Modifier.padding(end = 8.dp) modifier = Modifier.padding(end = 8.dp)
) )
} }
// Icon( Spacer(modifier = Modifier.weight(1f))
// imageVector = Icons.Default.KeyboardArrowRight,
// contentDescription = "展开", Image(painterResource(Res.drawable.ic_arrow_right),
// tint = Color(0xFF999999), contentDescription = null,
// modifier = Modifier.size(24.dp) modifier = Modifier
// ) .size(10.dp)
)
} }
HorizontalDivider(
color = Color(0x8067707F),
thickness = 1.dp,
)
} }
} }

136
shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/RegisterScreen.kt

@ -1,5 +1,6 @@
package com.whitefish.ring.ui.guide package com.whitefish.ring.ui.guide
import androidx.compose.foundation.Image
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.layout.* import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
@ -8,11 +9,16 @@ import androidx.compose.runtime.*
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import org.jetbrains.compose.resources.painterResource
import org.jetbrains.compose.ui.tooling.preview.Preview 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 @Composable
fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) -> Unit = { _, _ -> }) { fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String) -> Unit = { _, _ -> }) {
@ -26,51 +32,38 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String)
.fillMaxSize() .fillMaxSize()
.background(Color(0xFFF5F5F5)), .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( Column(
modifier = modifier =
Modifier Modifier
.fillMaxSize() .fillMaxSize()
.padding(horizontal = 24.dp), .padding(horizontal = 23.dp),
horizontalAlignment = Alignment.CenterHorizontally, 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( Column(
horizontalAlignment = Alignment.CenterHorizontally, modifier = Modifier.fillMaxWidth(),
horizontalAlignment = Alignment.Start,
) { ) {
Text( Text(
text = "Hi,", text = "Hi,",
fontSize = 28.sp, fontSize = 32.sp,
fontWeight = FontWeight.Medium, fontWeight = FontWeight.Medium,
color = Color(0xFF333333), color = Color(0xFF484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
) )
Text( Text(
text = "欢迎来到Acti", text = "欢迎来到Acti",
fontSize = 28.sp, fontSize = 32.sp,
fontWeight = FontWeight.Medium, fontWeight = FontWeight.Medium,
color = Color(0xFF333333), color = Color(0xFF484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
) )
} }
@ -89,7 +82,7 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String)
modifier = Modifier.padding(bottom = 8.dp), modifier = Modifier.padding(bottom = 8.dp),
) )
OutlinedTextField( TextField(
value = phoneNumber, value = phoneNumber,
onValueChange = { phoneNumber = it }, onValueChange = { phoneNumber = it },
placeholder = { placeholder = {
@ -98,15 +91,16 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String)
color = Color(0xFF999999), color = Color(0xFF999999),
) )
}, },
modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(12.dp),
colors = colors =
OutlinedTextFieldDefaults.colors( TextFieldDefaults.colors().copy(focusedContainerColor = Color.Transparent, unfocusedContainerColor = Color.Transparent),
focusedBorderColor = Color(0xFF007AFF), modifier = Modifier.fillMaxWidth(),
unfocusedBorderColor = Color(0xFFE5E5E5), // colors =
focusedContainerColor = Color.White, // TextField.colors(
unfocusedContainerColor = Color.White, // focusedBorderColor = Color.White,
), // unfocusedBorderColor = Color.White,
// focusedContainerColor = Color.White,
// unfocusedContainerColor = Color.White,
// ),
singleLine = true, singleLine = true,
) )
} }
@ -129,42 +123,38 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String)
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
) { ) {
OutlinedTextField( Box{
value = verificationCode, TextField(
onValueChange = { verificationCode = it }, value = verificationCode,
placeholder = { onValueChange = { verificationCode = it },
Text( placeholder = {
text = "请输入验证码", Text(
color = Color(0xFF999999), text = "请输入验证码",
) color = Color(0xFF999999),
}, )
modifier = Modifier.weight(1f), },
shape = RoundedCornerShape(12.dp), colors =
colors = TextFieldDefaults.colors().copy(focusedContainerColor = Color.Transparent, unfocusedContainerColor = Color.Transparent),
OutlinedTextFieldDefaults.colors( modifier = Modifier.fillMaxWidth(),
focusedBorderColor = Color(0xFF007AFF), singleLine = true,
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),
) )
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 =
Modifier Modifier
.fillMaxWidth() .fillMaxWidth()
.height(56.dp), .height(51.dp)
shape = RoundedCornerShape(28.dp), .padding(horizontal = 13.dp),
shape = RoundedCornerShape(30.dp),
colors = colors =
ButtonDefaults.buttonColors( ButtonDefaults.buttonColors(
containerColor = containerColor =
if (phoneNumber.isNotEmpty() && verificationCode.isNotEmpty()) { if (phoneNumber.isNotEmpty() && verificationCode.isNotEmpty()) {
Color(0xFF007AFF) Color(0x8098999B)
} else { } else {
Color(0xFFCCCCCC) Color(0xFFCCCCCC)
}, },
@ -205,6 +196,7 @@ fun RegisterScreen(onLoginClick: (phoneNumber: String, verificationCode: String)
Text( Text(
text = "登录", text = "登录",
fontSize = 18.sp, fontSize = 18.sp,
color = Color.Black,
fontWeight = FontWeight.Medium, fontWeight = FontWeight.Medium,
) )
} }

139
shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/WearingFingerScreen.kt

@ -1,5 +1,6 @@
package com.whitefish.ring.ui.guide package com.whitefish.ring.ui.guide
import androidx.compose.foundation.Image
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.border import androidx.compose.foundation.border
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
@ -15,19 +16,21 @@ import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import org.jetbrains.compose.resources.painterResource
import org.jetbrains.compose.ui.tooling.preview.Preview import org.jetbrains.compose.ui.tooling.preview.Preview
import ring.shared.generated.resources.Res
import ring.shared.generated.resources.bg_userinfo_guide
import ring.shared.generated.resources.ic_unuse_hand_left
import ring.shared.generated.resources.ic_unuse_hand_right
import ring.shared.generated.resources.ic_use_hand_left
import ring.shared.generated.resources.ic_use_hand_right
enum class Hand { enum class Hand {
LEFT, RIGHT LEFT, RIGHT
} }
enum class Finger {
THUMB, INDEX, MIDDLE, RING, PINKY
}
data class WearingPosition( data class WearingPosition(
val hand: Hand, val hand: Hand,
val finger: Finger
) )
@Composable @Composable
@ -42,6 +45,7 @@ fun WearingFingerScreen(
.fillMaxSize() .fillMaxSize()
.background(Color(0xFFF5F5F5)) .background(Color(0xFFF5F5F5))
) { ) {
Image(painterResource(Res.drawable.bg_userinfo_guide),contentDescription = null, modifier = Modifier.fillMaxSize())
Column( Column(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxSize()
@ -55,8 +59,8 @@ fun WearingFingerScreen(
text = "佩戴手指", text = "佩戴手指",
fontSize = 24.sp, fontSize = 24.sp,
fontWeight = FontWeight.Medium, fontWeight = FontWeight.Medium,
color = Color(0xFF333333), color = Color.Black,
textAlign = TextAlign.Center, textAlign = TextAlign.Start,
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) )
@ -65,9 +69,9 @@ fun WearingFingerScreen(
// 副标题 // 副标题
Text( Text(
text = "请选择您佩戴Acti戒指的手指", text = "请选择您佩戴Acti戒指的手指",
fontSize = 16.sp, fontSize = 12.sp,
color = Color(0xFF666666), color = Color.Black,
textAlign = TextAlign.Center, textAlign = TextAlign.Start,
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) )
@ -82,8 +86,8 @@ fun WearingFingerScreen(
HandSelector( HandSelector(
hand = Hand.LEFT, hand = Hand.LEFT,
selectedPosition = selectedPosition, selectedPosition = selectedPosition,
onFingerClick = { finger -> onFingerClick = {
val position = WearingPosition(Hand.LEFT, finger) val position = WearingPosition(Hand.LEFT)
selectedPosition = position selectedPosition = position
onFingerSelected(position) onFingerSelected(position)
} }
@ -93,13 +97,25 @@ fun WearingFingerScreen(
HandSelector( HandSelector(
hand = Hand.RIGHT, hand = Hand.RIGHT,
selectedPosition = selectedPosition, selectedPosition = selectedPosition,
onFingerClick = { finger -> onFingerClick = {
val position = WearingPosition(Hand.RIGHT, finger) val position = WearingPosition(Hand.RIGHT)
selectedPosition = position selectedPosition = position
onFingerSelected(position) onFingerSelected(position)
} }
) )
} }
val text = selectedPosition?.hand?.let {if (it == Hand.LEFT){
"您已选择佩戴在左手"
}else{
"您已选择佩戴在右手"
}}?:""
Text(text,
fontSize = 16.sp,
color = Color(0xFF999999),
modifier = Modifier.padding(top = 16.dp)
)
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.weight(1f))
@ -109,11 +125,12 @@ fun WearingFingerScreen(
enabled = selectedPosition != null, enabled = selectedPosition != null,
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.height(56.dp), .padding(horizontal = 12.dp)
shape = RoundedCornerShape(28.dp), .height(51.dp),
shape = RoundedCornerShape(30.dp),
colors = ButtonDefaults.buttonColors( colors = ButtonDefaults.buttonColors(
containerColor = if (selectedPosition != null) Color(0xFF007AFF) else Color(0xFFCCCCCC), containerColor = if (selectedPosition != null) Color(0x8098999B) else Color(0xFFCCCCCC),
contentColor = Color.White contentColor = Color.Black
) )
) { ) {
Text( Text(
@ -132,7 +149,7 @@ fun WearingFingerScreen(
private fun HandSelector( private fun HandSelector(
hand: Hand, hand: Hand,
selectedPosition: WearingPosition?, selectedPosition: WearingPosition?,
onFingerClick: (Finger) -> Unit onFingerClick: () -> Unit
) { ) {
Column( Column(
horizontalAlignment = Alignment.CenterHorizontally horizontalAlignment = Alignment.CenterHorizontally
@ -142,51 +159,25 @@ private fun HandSelector(
modifier = Modifier modifier = Modifier
.size(140.dp, 180.dp) .size(140.dp, 180.dp)
.background( .background(
Color.White, Color.Transparent,
RoundedCornerShape(20.dp) RoundedCornerShape(20.dp)
) ).clickable {
.border( onFingerClick.invoke()
width = 2.dp, },
color = Color(0xFFE5E5E5), contentAlignment = Alignment.Center,
shape = RoundedCornerShape(20.dp)
),
contentAlignment = Alignment.Center
) { ) {
// 简化的手部表示 if ( selectedPosition?.hand == hand){
Column( if (hand == Hand.LEFT){
horizontalAlignment = Alignment.CenterHorizontally, Image(painterResource(Res.drawable.ic_use_hand_left),contentDescription = null)
verticalArrangement = Arrangement.Center }else{
) { Image(painterResource(Res.drawable.ic_use_hand_right),contentDescription = null)
// 拇指
FingerButton(
finger = Finger.THUMB,
isSelected = selectedPosition?.hand == hand && selectedPosition.finger == Finger.THUMB,
onClick = { onFingerClick(Finger.THUMB) },
modifier = Modifier.offset(x = if (hand == Hand.LEFT) 20.dp else (-20).dp)
)
Spacer(modifier = Modifier.height(8.dp))
// 其他四个手指
Row(
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
listOf(Finger.INDEX, Finger.MIDDLE, Finger.RING, Finger.PINKY).forEach { finger ->
FingerButton(
finger = finger,
isSelected = selectedPosition?.hand == hand && selectedPosition.finger == finger,
onClick = { onFingerClick(finger) }
)
}
} }
}else{
// 显示戒指图标在选中的手指上 if (hand == Hand.LEFT){
if (selectedPosition?.hand == hand) { Image(painterResource(Res.drawable.ic_unuse_hand_left),contentDescription = null)
Text( }else{
text = "💍", Image(painterResource(Res.drawable.ic_unuse_hand_right),contentDescription = null)
fontSize = 16.sp,
modifier = Modifier.padding(top = 4.dp)
)
} }
} }
} }
@ -203,32 +194,6 @@ private fun HandSelector(
} }
} }
@Composable
private fun FingerButton(
finger: Finger,
isSelected: Boolean,
onClick: () -> Unit,
modifier: Modifier = Modifier
) {
Box(
modifier = modifier
.size(20.dp, 40.dp)
.clip(RoundedCornerShape(10.dp))
.background(
if (isSelected) Color(0xFF007AFF) else Color(0xFFE5E5E5)
)
.clickable { onClick() },
contentAlignment = Alignment.Center
) {
if (isSelected) {
Text(
text = "💍",
fontSize = 12.sp
)
}
}
}
@Composable @Composable
@Preview @Preview
fun WearingFingerScreenPreview() { fun WearingFingerScreenPreview() {

130
shared/src/commonMain/kotlin/com/whitefish/ring/ui/guide/WelcomeScreen.kt

@ -1,6 +1,8 @@
package com.whitefish.ring.ui.guide package com.whitefish.ring.ui.guide
import androidx.compose.foundation.Image
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.* import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.* import androidx.compose.material3.*
@ -8,11 +10,17 @@ import androidx.compose.runtime.*
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import org.jetbrains.compose.resources.painterResource
import org.jetbrains.compose.ui.tooling.preview.Preview import org.jetbrains.compose.ui.tooling.preview.Preview
import ring.shared.generated.resources.Res
import ring.shared.generated.resources.bg_welcome
import ring.shared.generated.resources.ic_uapp_checked
import ring.shared.generated.resources.ic_uapp_uncheck
@Composable @Composable
fun WelcomeScreen(onStartClick: () -> Unit = {}) { fun WelcomeScreen(onStartClick: () -> Unit = {}) {
@ -24,21 +32,23 @@ fun WelcomeScreen(onStartClick: () -> Unit = {}) {
.fillMaxSize() .fillMaxSize()
.background(Color(0xFFF5F5F5)), .background(Color(0xFFF5F5F5)),
) { ) {
Image(painterResource(Res.drawable.bg_welcome),contentDescription = null, modifier = Modifier.fillMaxSize(), contentScale = ContentScale.Crop)
Column( Column(
modifier = modifier =
Modifier Modifier
.fillMaxSize() .fillMaxSize()
.padding(horizontal = 24.dp), .padding(horizontal = 36.dp),
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,
) { ) {
Spacer(modifier = Modifier.height(120.dp)) Spacer(modifier = Modifier.height(21.dp))
// 主标题 // 主标题
Text( Text(
text = "Acti", text = "Acti",
fontSize = 48.sp, fontSize = 64.sp,
fontWeight = FontWeight.Bold, color = Color(0xFF484848),
color = Color(0xFF333333),
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
) )
@ -47,9 +57,9 @@ fun WelcomeScreen(onStartClick: () -> Unit = {}) {
// 副标题 // 副标题
Text( Text(
text = "赋能每一个动作", text = "赋能每一个动作",
fontSize = 18.sp, fontSize = 36.sp,
fontWeight = FontWeight.Normal, fontWeight = FontWeight.Normal,
color = Color(0xFF666666), color = Color(0xFF484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
) )
@ -58,106 +68,76 @@ fun WelcomeScreen(onStartClick: () -> Unit = {}) {
// 英文副标题 // 英文副标题
Text( Text(
text = "Empower Every Move", text = "Empower Every Move",
fontSize = 16.sp, fontSize = 24.sp,
fontWeight = FontWeight.Normal, fontWeight = FontWeight.Normal,
color = Color(0xFF999999), color = Color(0xFF484848),
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
) )
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.weight(1f))
// 戒指图片占位符
Box( // 立即使用按钮
Button(
onClick = onStartClick,
enabled = isChecked,
modifier = modifier =
Modifier Modifier
.size(200.dp) .fillMaxWidth()
.background( .height(51.dp),
Color(0xFFE5E5E5), shape = RoundedCornerShape(30.dp),
RoundedCornerShape(16.dp), colors =
), ButtonDefaults.buttonColors(
contentAlignment = Alignment.Center, containerColor = if (isChecked) Color(0xFF87919F) else Color(0xFFCCCCCC),
contentColor = Color.White,
),
) { ) {
Text( Text(
text = "💍", text = "立即使用",
fontSize = 80.sp, fontSize = 16.sp,
fontWeight = FontWeight.Medium,
) )
} }
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.height(9.dp))
// 协议同意checkbox // 协议同意checkbox
Row( Row(
modifier = modifier =
Modifier Modifier
.fillMaxWidth() .fillMaxWidth(),
.padding(horizontal = 16.dp),
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.Center
) { ) {
Checkbox( UAPPCheckBox(isChecked, modifier = Modifier.size(15.dp)){
checked = isChecked, isChecked = !isChecked
onCheckedChange = { isChecked = it }, }
colors =
CheckboxDefaults.colors(
checkedColor = Color(0xFF007AFF),
),
)
Spacer(modifier = Modifier.width(8.dp)) Spacer(modifier = Modifier.width(8.dp))
Text( Text(
text = "我已阅读并同意", text = "我已阅读井同意《用户隐私协议》和《用户注册协议》",
fontSize = 14.sp, fontSize = 12.sp,
color = Color(0xFF666666), color = Color(0xFF6636363),
)
Text(
text = "《用户协议》",
fontSize = 14.sp,
color = Color(0xFF007AFF),
)
Text(
text = "",
fontSize = 14.sp,
color = Color(0xFF666666),
)
Text(
text = "《隐私政策》",
fontSize = 14.sp,
color = Color(0xFF007AFF),
) )
} }
Spacer(modifier = Modifier.height(24.dp)) Spacer(modifier = Modifier.height(300.dp))
// 立即使用按钮
Button(
onClick = onStartClick,
enabled = isChecked,
modifier =
Modifier
.fillMaxWidth()
.height(56.dp),
shape = RoundedCornerShape(28.dp),
colors =
ButtonDefaults.buttonColors(
containerColor = if (isChecked) Color(0xFF007AFF) else Color(0xFFCCCCCC),
contentColor = Color.White,
),
) {
Text(
text = "立即使用",
fontSize = 18.sp,
fontWeight = FontWeight.Medium,
)
}
Spacer(modifier = Modifier.height(40.dp))
} }
} }
} }
@Composable
fun UAPPCheckBox(checked: Boolean, modifier: Modifier, onClick: () -> Unit){
if (checked){
Image(painterResource(Res.drawable.ic_uapp_checked), contentDescription = null, modifier = modifier.clickable { onClick.invoke() })
}else{
Image(painterResource(Res.drawable.ic_uapp_uncheck), contentDescription = null, modifier = modifier.clickable { onClick.invoke() })
}
}
@Composable @Composable
@Preview @Preview
fun WelcomeScreenPreview() { fun WelcomeScreenPreview() {

Loading…
Cancel
Save