eric/technologia-jetpack-compose
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

dm-113

Browse source
This commit is contained in:
Eric85710 2026-06-10 16:18:16 +08:00
parent dfe949abf3
commit 23a217ee92
2 changed files with 101 additions and 109 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/src/main/java/com/example/login_v3/home/Message/UI/Detail/Message_Messaging.kt
View file

@ -228,7 +228,7 @@ fun MessageMessaging(
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.height(56.dp) // 👈 固定標準的 TopAppBar 高度，不會再扁扁一條了！ .height(58.dp) // 👈 固定標準的 TopAppBar 高度，不會再扁扁一條了！
.padding(horizontal = 12.dp) // 側邊留點呼吸空間 .padding(horizontal = 12.dp) // 側邊留點呼吸空間
) { ) {
// 如果你想加返回按鈕，可以加在這裡 // 如果你想加返回按鈕，可以加在這裡
@ -237,7 +237,7 @@ fun MessageMessaging(
if (currentState is MessagesUiState.Success) { if (currentState is MessagesUiState.Success) {
UserAvatar( UserAvatar(
avatarUrl = currentState.partnerAvatarUrl, avatarUrl = currentState.partnerAvatarUrl,
modifier = Modifier.size(36.dp) modifier = Modifier.size(42.dp)
) )
} }
@ -246,10 +246,14 @@ fun MessageMessaging(
Text( Text(
text = topBarTitle, text = topBarTitle,
style = MaterialTheme.typography.titleMedium, style = MaterialTheme.typography.titleMedium,
color = Color.Black fontSize = 24.sp, // 👈 直接在這裡設定你想要的 sp 大小
fontWeight = FontWeight.Bold,
color = Color(0xFF333333),
maxLines = 1,
overflow = TextOverflow.Ellipsis
) )
Spacer(modifier = Modifier.width(8.dp)) Spacer(modifier = Modifier.width(12.dp))
if (currentState is MessagesUiState.Success) { if (currentState is MessagesUiState.Success) {
if (currentState.partnerStatus == UserStatus.ONLINE) { if (currentState.partnerStatus == UserStatus.ONLINE) {

198
app/src/main/java/com/example/login_v3/home/Message/UI/Detail/Message_list.kt
View file

@ -229,140 +229,128 @@ fun RoomItem(
val title = room.displayTitle val title = room.displayTitle
with(sharedTransitionScope){ with(sharedTransitionScope){
Card( Box(
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.padding(horizontal = 12.dp, vertical = 6.dp) .padding(horizontal = 12.dp, vertical = 6.dp)
.clickable { onClick(room.roomId, room.displayTitle) } // 1. 先處理轉場動畫（確保容器變形基底乾淨）
// 🌟 關鍵：把共享元素鎖定在整個外層 Container 上！
.sharedElement( .sharedElement(
rememberSharedContentState(key = "container_${room.roomId}"), rememberSharedContentState(key = "container_${room.roomId}"),
animatedVisibilityScope = animatedVisibilityScope animatedVisibilityScope = animatedVisibilityScope
) )
, // 2. 再綁定點擊事件
shape = RoundedCornerShape(16.dp), // 較大的圓角看起來更現代 .clickable { onClick(room.roomId, room.displayTitle) }
colors = CardDefaults.cardColors( ){
containerColor = Color.Transparent // ✅ 透明背景 //glass effect
),
elevation = CardDefaults.cardElevation(
defaultElevation = 0.dp // 增加輕微陰影
)
) {
Box( Box(
modifier = Modifier modifier = Modifier
.fillMaxSize() .matchParentSize()
){ .blur(10.dp)
//glass effect )
Box( Box(
modifier = Modifier modifier = Modifier
.matchParentSize() .matchParentSize()
.blur(10.dp) .background(
) color = MaterialTheme.colorScheme.primary,
Box( RoundedCornerShape(16.dp)
modifier = Modifier )
.matchParentSize() .border(
.background( 1.dp,
color = MaterialTheme.colorScheme.primary, Color.White.copy(alpha = 0.3f),
RoundedCornerShape(16.dp) RoundedCornerShape(16.dp)
) )
.border( )
1.dp,
Color.White.copy(alpha = 0.3f),
RoundedCornerShape(16.dp)
)
)
Row( Row(
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.padding(12.dp), modifier = Modifier.padding(12.dp),
) {
// 1. 頭像
val imageUrl = room.roomIconUrl ?: room.partner?.fullContactAvatarUrl
AsyncImage(
model = imageUrl,
contentDescription = "Avatar",
contentScale = ContentScale.Crop,
modifier = Modifier
.size(56.dp) // 稍微加大一點
.clip(CircleShape)
.border(1.dp, Color.White, CircleShape) // 頭像加個細白邊
.background(Color.LightGray)
)
Spacer(modifier = Modifier.width(16.dp))
// 2. 中間內容
Column(
modifier = Modifier.weight(1f)
) { ) {
// 1. 頭像 Text(
val imageUrl = room.roomIconUrl ?: room.partner?.fullContactAvatarUrl text = room.roomName.orEmpty().ifEmpty {
AsyncImage( room.partner?.displayName ?: "Unknown"
model = imageUrl, },
contentDescription = "Avatar", style = MaterialTheme.typography.titleMedium,
contentScale = ContentScale.Crop, fontWeight = FontWeight.Bold,
modifier = Modifier color = Color(0xFF333333),
.size(56.dp) // 稍微加大一點 maxLines = 1,
.clip(CircleShape) overflow = TextOverflow.Ellipsis
.border(1.dp, Color.White, CircleShape) // 頭像加個細白邊
.background(Color.LightGray)
) )
Spacer(modifier = Modifier.width(16.dp)) Spacer(modifier = Modifier.height(4.dp))
// 2. 中間內容 val lastMsgText = when {
Column( room.lastMessage?.isDeleted == true -> "訊息已刪除"
modifier = Modifier.weight(1f) room.lastMessage?.content != null -> room.lastMessage.content
) { room.lastMessage?.attachment != null -> "[檔案] ${room.lastMessage.attachment.filename}"
else -> "尚未有訊息"
}
Row() {
Text( Text(
text = room.roomName.orEmpty().ifEmpty { text = lastMsgText,
room.partner?.displayName ?: "Unknown" style = MaterialTheme.typography.bodyMedium,
}, color = Color.Gray,
style = MaterialTheme.typography.titleMedium,
fontWeight = FontWeight.Bold,
color = Color(0xFF333333),
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
) )
Spacer(modifier = Modifier.height(4.dp)) Spacer(modifier = Modifier.width(6.dp))
val lastMsgText = when { if (room.unreadCount > 0) {
room.lastMessage?.isDeleted == true -> "訊息已刪除" Badge(
room.lastMessage?.content != null -> room.lastMessage.content containerColor = Color(0xFFDA7029), // 使用你的主橘色
room.lastMessage?.attachment != null -> "[檔案] ${room.lastMessage.attachment.filename}" contentColor = Color.White
else -> "尚未有訊息" ) {
} Text(
text = if (room.unreadCount > 99) "99+" else room.unreadCount.toString(),
Row() { modifier = Modifier.padding(horizontal = 4.dp)
Text( )
text = lastMsgText,
style = MaterialTheme.typography.bodyMedium,
color = Color.Gray,
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
Spacer(modifier = Modifier.width(6.dp))
if (room.unreadCount > 0) {
Badge(
containerColor = Color(0xFFDA7029), // 使用你的主橘色
contentColor = Color.White
) {
Text(
text = if (room.unreadCount > 99) "99+" else room.unreadCount.toString(),
modifier = Modifier.padding(horizontal = 4.dp)
)
}
} }
} }
Spacer(modifier = Modifier.width(2.dp))
} }
Spacer(modifier = Modifier.width(2.dp))
//online status
val partner = room.partner // 先從 room 取得 partner
if (partner != null) {
val status = UserStatus.fromString(partner.status)
if (status != UserStatus.UNKNOWN) {
Box(
modifier = Modifier
.size(14.dp)
.background(status.color, CircleShape) // 直接設定圓形背景
.border(2.dp, Color.White, CircleShape) // 白色外圈邊線
)
}
}
Spacer(modifier = Modifier.width(10.dp))
} }
//online status
val partner = room.partner // 先從 room 取得 partner
if (partner != null) {
val status = UserStatus.fromString(partner.status)
if (status != UserStatus.UNKNOWN) {
Box(
modifier = Modifier
.size(14.dp)
.background(status.color, CircleShape) // 直接設定圓形背景
.border(2.dp, Color.White, CircleShape) // 白色外圈邊線
)
}
}
Spacer(modifier = Modifier.width(10.dp))
} }
} }
} }