更新动态详情页样式

- 更新动态详情页样式，包括图片比例、评论样式、点赞和收藏按钮等 - 新增文案 - 移除冗余代码
2024-09-06 21:39:57 +08:00
parent 3a668b8b2a
commit d1e9365d69
15 changed files with 185 additions and 105 deletions
--- a/app/src/main/java/com/aiosman/riderpro/ui/account/edit2.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/account/edit2.kt
@@ -48,6 +48,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
@@ -154,16 +155,6 @@ fun AccountEditScreen2() {
            }
        }
    }
-    val pickBannerImageLauncher = rememberLauncherForActivityResult(
-        contract = ActivityResultContracts.StartActivityForResult()
-    ) { result ->
-        if (result.resultCode == Activity.RESULT_OK) {
-            val uri = result.data?.data
-            uri?.let {
-                bannerImageUrl = uri
-            }
-        }
-    }

    LaunchedEffect(Unit) {
        reloadProfile()
@@ -178,7 +169,7 @@ fun AccountEditScreen2() {
            modifier = Modifier.padding(horizontal = 24.dp, vertical = 16.dp)
        ) {
            NoticeScreenHeader(
-                title = "编辑资料",
+                title = stringResource(R.string.edit_profile),
                moreIcon = false
            ) {

@@ -248,7 +239,7 @@ fun AccountEditScreen2() {
                    verticalAlignment = Alignment.CenterVertically
                ) {
                    Text(
-                        text = "Name",
+                        text = stringResource(R.string.nickname),
                        modifier = Modifier
                            .widthIn(100.dp),
                        style = TextStyle(
@@ -284,7 +275,7 @@ fun AccountEditScreen2() {
                    verticalAlignment = Alignment.CenterVertically
                ) {
                    Text(
-                        text = "Bio",
+                        text = stringResource(R.string.bio),
                        modifier = Modifier
                            .widthIn(100.dp),
                        style = TextStyle(
--- a/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentModal.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentModal.kt
@@ -34,6 +34,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.platform.LocalSoftwareKeyboardController
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
@@ -158,8 +159,8 @@ fun CommentModalContent(

        ) {
            Text(
-                "评论",
-                fontSize = 20.sp,
+                stringResource(R.string.comment),
+                fontSize = 18.sp,
                fontWeight = FontWeight.Bold,
                modifier = Modifier.align(Alignment.Center)
            )
--- a/app/src/main/java/com/aiosman/riderpro/ui/composables/AnimatedFavouriteButton.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/AnimatedFavouriteButton.kt
@@ -26,7 +26,6 @@ fun AnimatedFavouriteIcon(
    onClick: (() -> Unit)? = null
 ) {
    val animatableRotation = remember { Animatable(0f) }
-    val animatedColor by animateColorAsState(targetValue = if (isFavourite) Color(0xFFd83737) else Color.Black)
    val scope = rememberCoroutineScope()
    suspend fun shake() {
        repeat(2) {
@@ -57,12 +56,15 @@ fun AnimatedFavouriteIcon(
        }
    }) {
        Image(
-            painter = painterResource(id = R.drawable.rider_pro_favoriate),
-            contentDescription = "Like",
+            painter =  if (isFavourite) {
+                painterResource(id = R.drawable.rider_pro_favourited)
+            } else {
+                painterResource(id = R.drawable.rider_pro_favourite)
+            },
+            contentDescription = "Favourite",
            modifier = modifier.graphicsLayer {
                rotationZ = animatableRotation.value
            },
-            colorFilter = ColorFilter.tint(animatedColor)
        )
    }
 }
--- a/app/src/main/java/com/aiosman/riderpro/ui/composables/AnimatedLikeButton.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/AnimatedLikeButton.kt
@@ -28,7 +28,6 @@ fun AnimatedLikeIcon(
    onClick: (() -> Unit)? = null
 ) {
    val animatableRotation = remember { Animatable(0f) }
-    val animatedColor by animateColorAsState(targetValue = if (liked) Color(0xFFd83737) else Color.Black)
    val scope = rememberCoroutineScope()
    suspend fun shake() {
        repeat(2) {
@@ -59,12 +58,13 @@ fun AnimatedLikeIcon(
        }
    }) {
        Image(
-            painter = painterResource(id = R.drawable.rider_pro_like),
+            painter = if (!liked) painterResource(id = R.drawable.rider_pro_moment_like) else painterResource(
+                id = R.drawable.rider_pro_moment_liked
+            ),
            contentDescription = "Like",
            modifier = modifier.graphicsLayer {
-                    rotationZ = animatableRotation.value
-                },
-            colorFilter = androidx.compose.ui.graphics.ColorFilter.tint(animatedColor)
+                rotationZ = animatableRotation.value
+            },
        )
    }
 }
--- a/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/moment/Moment.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/moment/Moment.kt
@@ -554,7 +554,7 @@ fun MomentBottomOperateRowGroup(
                contentAlignment = Alignment.Center
            ) {
                MomentOperateBtn(
-                    icon = R.drawable.rider_pro_moment_comment,
+                    icon = R.drawable.rider_pro_comment,
                    count = momentEntity.commentCount.toString()
                )
            }
--- a/app/src/main/java/com/aiosman/riderpro/ui/post/Post.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/post/Post.kt
@@ -71,6 +71,7 @@ import androidx.paging.cachedIn
 import androidx.paging.compose.LazyPagingItems
 import androidx.paging.compose.collectAsLazyPagingItems
 import androidx.paging.map
+import com.aiosman.riderpro.AppState
 import com.aiosman.riderpro.LocalAnimatedContentScope
 import com.aiosman.riderpro.LocalNavController
 import com.aiosman.riderpro.LocalSharedTransitionScope
@@ -92,6 +93,8 @@ import com.aiosman.riderpro.exp.timeAgo
 import com.aiosman.riderpro.entity.MomentEntity
 import com.aiosman.riderpro.entity.MomentImageEntity
 import com.aiosman.riderpro.ui.NavigationRoute
+import com.aiosman.riderpro.ui.composables.AnimatedFavouriteIcon
+import com.aiosman.riderpro.ui.composables.AnimatedLikeIcon
 import com.aiosman.riderpro.ui.composables.StatusBarMaskLayout
 import com.aiosman.riderpro.ui.composables.BottomNavigationPlaceholder
 import com.aiosman.riderpro.ui.composables.CustomAsyncImage
@@ -319,6 +322,7 @@ fun PostScreen(
        Column(
            modifier = Modifier
                .fillMaxSize()
+                .background(Color.White)
        ) {
            StatusBarSpacer()
            Header(
@@ -345,7 +349,7 @@ fun PostScreen(
                    Box(
                        modifier = Modifier
                            .fillMaxWidth()
-                            .aspectRatio(1f)
+                            .aspectRatio(383f / 527f)
                    ) {
                        PostImageView(
                            id,
@@ -357,7 +361,35 @@ fun PostScreen(
                        id,
                        viewModel.moment
                    )
+                    Spacer(modifier = Modifier.height(16.dp))
+                    Box(
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .padding(horizontal = 16.dp)
+                            .height(1.dp)
+                            .background(Color(0xFFF7F7F7))
+                    ) {
+
+                    }
+                    Spacer(modifier = Modifier.height(24.dp))
+                    Row(
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .padding(horizontal = 16.dp),
+                        horizontalArrangement = Arrangement.SpaceBetween
+                    ) {
+                        Text(
+                            text = stringResource(
+                                R.string.comment_count,
+                                (viewModel.moment?.commentCount ?: 0)
+                            ), fontSize = 14.sp
+                        )
+                    }
+
+                    Spacer(modifier = Modifier.height(16.dp))
+
                }
+
                items(commentsPagging.itemCount) { idx ->
                    val item = commentsPagging[idx] ?: return@items
                    Box(
@@ -440,30 +472,34 @@ fun Header(

        Spacer(modifier = Modifier.width(8.dp))
        Text(text = nickname ?: "", fontWeight = FontWeight.Bold)
-        Box(
-            modifier = Modifier
-                .height(20.dp)
-                .wrapContentWidth()
-                .padding(start = 6.dp)
-                .noRippleClickable {
-                    onFollowClick()
-                },
-            contentAlignment = Alignment.Center
-        ) {
-            Image(
-                modifier = Modifier.height(18.dp),
-                painter = painterResource(id = R.drawable.follow_bg),
-                contentDescription = ""
-            )
-            Text(
-                text = if (isFollowing) stringResource(R.string.following_upper) else stringResource(
-                    R.string.follow_upper
-                ),
-                fontSize = 12.sp,
-                color = Color.White,
-                style = TextStyle(fontWeight = FontWeight.Bold)
-            )
+        if (AppState.UserId != userId) {
+            Box(
+                modifier = Modifier
+                    .height(20.dp)
+                    .wrapContentWidth()
+                    .padding(start = 6.dp)
+                    .noRippleClickable {
+                        onFollowClick()
+                    },
+                contentAlignment = Alignment.Center
+            ) {
+                Image(
+                    modifier = Modifier.height(18.dp),
+                    painter = painterResource(id = R.drawable.follow_bg),
+                    contentDescription = ""
+                )
+                Text(
+                    text = if (isFollowing) stringResource(R.string.following_upper) else stringResource(
+                        R.string.follow_upper
+                    ),
+                    fontSize = 12.sp,
+                    color = Color.White,
+                    style = TextStyle(fontWeight = FontWeight.Bold)
+                )
+            }
        }
+
+
    }
 }

@@ -521,7 +557,7 @@ fun PostImageView(
            images.forEachIndexed { index, _ ->
                Box(
                    modifier = Modifier
-                        .size(8.dp)
+                        .size(4.dp)
                        .clip(CircleShape)

                        .background(
@@ -549,20 +585,18 @@ fun PostDetails(

    Column(
        modifier = Modifier
-            .padding(16.dp)
+            .padding(start = 16.dp, end = 16.dp, top = 12.dp)
            .fillMaxWidth()
            .wrapContentHeight()
    ) {
-
-        Text(
-            text = momentEntity?.momentTextContent ?: "",
-            fontSize = 16.sp,
-            fontWeight = FontWeight.Bold,
-        )
+        if (!momentEntity?.momentTextContent.isNullOrEmpty()) {
+            Text(
+                text = momentEntity?.momentTextContent ?: "",
+                fontSize = 16.sp,
+                fontWeight = FontWeight.Bold,
+            )
+        }
        Text(text = "${momentEntity?.time?.formatPostTime()}")
-        Spacer(modifier = Modifier.height(8.dp))
-        Text(text = stringResource(R.string.comment_count, (momentEntity?.commentCount ?: 0)))
-
    }
 }

@@ -609,7 +643,6 @@ fun CommentItem(commentEntity: CommentEntity, onLike: () -> Unit = {}) {
            Box(
                modifier = Modifier
                    .size(40.dp)
-                    .clip(CircleShape)
                    .background(Color.Gray.copy(alpha = 0.1f))
                    .noRippleClickable {
                        navController.navigate(
@@ -632,27 +665,24 @@ fun CommentItem(commentEntity: CommentEntity, onLike: () -> Unit = {}) {
            Column(
                modifier = Modifier.weight(1f)
            ) {
-                Text(text = commentEntity.name, fontWeight = FontWeight.Bold)
-                Text(text = commentEntity.comment)
+                Text(text = commentEntity.name, fontWeight = FontWeight.Bold, fontSize = 14.sp)
+                Text(text = commentEntity.comment, fontSize = 12.sp)
                Text(
                    text = commentEntity.date.timeAgo(context),
                    fontSize = 12.sp,
                    color = Color.Gray
                )
            }
+            Spacer(modifier = Modifier.width(16.dp))
            Column(
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
-                IconButton(onClick = {
-                    onLike()
-                }) {
-                    Icon(
-                        Icons.Filled.Favorite,
-                        contentDescription = "Like",
-                        tint = if (commentEntity.liked) Color.Red else Color.Gray
-                    )
-                }
-                Text(text = commentEntity.likes.toString())
+                AnimatedLikeIcon(
+                    liked = commentEntity.liked,
+                    onClick = onLike,
+                    modifier = Modifier.size(16.dp)
+                )
+                Text(text = commentEntity.likes.toString(), fontSize = 11.sp)
            }
        }
        Spacer(modifier = Modifier.height(8.dp))
@@ -695,18 +725,25 @@ fun BottomNavigationBar(
    Column(
        modifier = Modifier.background(Color.White)
    ) {
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(1.dp)
+                .background(Color(0xFFF7F7F7))
+        ) {
+
+        }
        Row(
            verticalAlignment = Alignment.CenterVertically,
            modifier = Modifier
-                .padding(horizontal = 16.dp)
+                .padding(horizontal = 16.dp, vertical = 13.dp)
                .background(Color.White)
        ) {
            // grey round box
            Box(
                modifier = Modifier
-                    .padding(8.dp)
                    .clip(RoundedCornerShape(16.dp))
-                    .background(Color.Gray.copy(alpha = 0.1f))
+                    .background(Color(0xFFF5F5F5))
                    .weight(1f)
                    .height(31.dp)
                    .padding(8.dp)
@@ -717,40 +754,34 @@ fun BottomNavigationBar(
                Row(
                    verticalAlignment = Alignment.CenterVertically
                ) {
-                    Icon(Icons.Filled.Edit, contentDescription = "Send")
+                    Image(
+                        ImageVector.vectorResource(R.drawable.rider_pro_new_comment),
+                        contentDescription = "Send"
+                    )
                    Spacer(modifier = Modifier.width(8.dp))
-                    Text(text = stringResource(R.string.post_comment_hint), fontSize = 12.sp)
+                    Text(
+                        text = stringResource(R.string.post_comment_hint),
+                        fontSize = 12.sp,
+                        color = Color(0xFFCCCCCC)
+                    )
                }
            }
-
-            IconButton(
-                onClick = {
-                    onLikeClick()
-                }) {
-                Icon(
-                    imageVector = ImageVector.vectorResource(id = R.drawable.rider_pro_like),
-                    contentDescription = "like",
-                    tint = if (momentEntity?.liked == true) Color.Red else Color.Gray
-                )
-            }
+            Spacer(modifier = Modifier.width(16.dp))
+            AnimatedLikeIcon(
+                liked = momentEntity?.liked == true,
+                onClick = onLikeClick,
+                modifier = Modifier.size(24.dp)
+            )
+            Spacer(modifier = Modifier.width(4.dp))
            Text(text = momentEntity?.likeCount.toString())
-            IconButton(
-                onClick = {
-                    onFavoriteClick()
-                }
-            ) {
-                Icon(
-                    imageVector = ImageVector.vectorResource(id = R.drawable.rider_pro_favoriate),
-                    contentDescription = "Favourite",
-                    tint = if (momentEntity?.isFavorite == true) Color.Red else Color.Gray
-                )
-            }
+            Spacer(modifier = Modifier.width(16.dp))
+            AnimatedFavouriteIcon(
+                isFavourite = momentEntity?.isFavorite == true,
+                onClick = onFavoriteClick,
+                modifier = Modifier.size(24.dp)
+            )
+            Spacer(modifier = Modifier.width(4.dp))
            Text(text = momentEntity?.favoriteCount.toString())
-//            IconButton(
-//                onClick = { /*TODO*/ }) {
-//                Icon(Icons.Filled.CheckCircle, contentDescription = "Send")
-//            }
-//            Text(text = "2077")

        }
        BottomNavigationPlaceholder(