feat: 复刻小程序四大主页面与底部导航(UI 优先,本地 mock)
This commit is contained in:
@@ -0,0 +1,37 @@
|
||||
package com.mingyuan.android_client.core.ui.status
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.Row
|
||||
import androidx.compose.foundation.layout.Spacer
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.foundation.shape.CircleShape
|
||||
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.text.font.FontWeight
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import com.mingyuan.android_client.core.model.CheckinStatus
|
||||
|
||||
@Composable
|
||||
fun StatusBadge(
|
||||
status: CheckinStatus,
|
||||
modifier: Modifier = Modifier,
|
||||
) {
|
||||
val color = status.statusColor()
|
||||
Row(
|
||||
modifier = modifier
|
||||
.background(color.copy(alpha = 0.12f), RoundedCornerShape(50))
|
||||
.padding(horizontal = 8.dp, vertical = 3.dp),
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
) {
|
||||
Box(Modifier.size(6.dp).background(color, CircleShape))
|
||||
Spacer(Modifier.width(4.dp))
|
||||
Text(status.label, color = color, fontSize = 12.sp, fontWeight = FontWeight.SemiBold)
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
package com.mingyuan.android_client.core.ui.status
|
||||
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import com.mingyuan.android_client.core.designsystem.theme.StatusAbsent
|
||||
import com.mingyuan.android_client.core.designsystem.theme.StatusEarlyLeave
|
||||
import com.mingyuan.android_client.core.designsystem.theme.StatusLate
|
||||
import com.mingyuan.android_client.core.designsystem.theme.StatusLeave
|
||||
import com.mingyuan.android_client.core.designsystem.theme.StatusNormal
|
||||
import com.mingyuan.android_client.core.model.CheckinStatus
|
||||
|
||||
fun CheckinStatus.statusColor(): Color = when (this) {
|
||||
CheckinStatus.NORMAL -> StatusNormal
|
||||
CheckinStatus.LATE -> StatusLate
|
||||
CheckinStatus.LEAVE -> StatusLeave
|
||||
CheckinStatus.ABSENT -> StatusAbsent
|
||||
CheckinStatus.EARLY_LEAVE -> StatusEarlyLeave
|
||||
}
|
||||
@@ -0,0 +1,60 @@
|
||||
package com.mingyuan.android_client.core.ui.status
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.border
|
||||
import androidx.compose.foundation.clickable
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.Row
|
||||
import androidx.compose.foundation.layout.Spacer
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.foundation.shape.CircleShape
|
||||
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.shadow
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import com.mingyuan.android_client.core.designsystem.theme.PillIdleBorder
|
||||
import com.mingyuan.android_client.core.designsystem.theme.SecondaryText
|
||||
import com.mingyuan.android_client.core.model.CheckinStatus
|
||||
|
||||
@Composable
|
||||
fun StatusPill(
|
||||
status: CheckinStatus,
|
||||
selected: Boolean,
|
||||
onClick: () -> Unit,
|
||||
modifier: Modifier = Modifier,
|
||||
) {
|
||||
val color = status.statusColor()
|
||||
val shape = RoundedCornerShape(50)
|
||||
|
||||
val background = if (selected) color else Color.White
|
||||
val textColor = if (selected) Color.White else SecondaryText
|
||||
val borderColor = if (selected) color else PillIdleBorder
|
||||
val dotColor = if (selected) Color.White else color
|
||||
|
||||
Row(
|
||||
modifier = modifier
|
||||
.shadow(
|
||||
elevation = if (selected) 6.dp else 0.dp,
|
||||
shape = shape,
|
||||
spotColor = color.copy(alpha = 0.22f),
|
||||
ambientColor = color.copy(alpha = 0.22f),
|
||||
)
|
||||
.background(background, shape)
|
||||
.border(1.dp, borderColor, shape)
|
||||
.clickable(onClick = onClick)
|
||||
.padding(horizontal = 14.dp, vertical = 9.dp),
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
) {
|
||||
Box(Modifier.size(8.dp).background(dotColor, CircleShape))
|
||||
Spacer(Modifier.width(6.dp))
|
||||
Text(status.label, color = textColor, fontSize = 13.sp, fontWeight = FontWeight.SemiBold)
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user