更新多处动画行为

2024-08-24 17:57:04 +08:00
parent 1b41e98011
commit 6c888655f5
9 changed files with 219 additions and 49 deletions
--- a/app/src/main/java/com/aiosman/riderpro/ui/Navi.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/Navi.kt
@@ -39,6 +39,7 @@ import com.aiosman.riderpro.ui.login.SignupScreen
 import com.aiosman.riderpro.ui.login.UserAuthScreen
 import com.aiosman.riderpro.ui.index.tabs.message.NotificationsScreen
 import com.aiosman.riderpro.ui.modification.EditModificationScreen
+import com.aiosman.riderpro.ui.post.NewPostImageGridScreen
 import com.aiosman.riderpro.ui.post.NewPostScreen
 import com.aiosman.riderpro.ui.post.PostScreen
 import com.aiosman.riderpro.ui.profile.AccountProfile
@@ -68,6 +69,7 @@ sealed class NavigationRoute(
    data object ImageViewer : NavigationRoute("ImageViewer")
    data object ChangePasswordScreen : NavigationRoute("ChangePasswordScreen")
    data object FavouritesScreen : NavigationRoute("FavouritesScreen")
+    data object NewPostImageGrid : NavigationRoute("NewPostImageGrid")
 }


@@ -194,6 +196,9 @@ fun NavigationController(
        composable(route = NavigationRoute.FavouritesScreen.route) {
            FavouriteScreen()
        }
+        composable(route = NavigationRoute.NewPostImageGrid.route) {
+            NewPostImageGridScreen()
+        }
    }


--- a/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentModal.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentModal.kt
@@ -7,9 +7,11 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.ime
+import androidx.compose.foundation.layout.navigationBars
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
@@ -92,6 +94,7 @@ fun CommentModalContent(
            }
        }
    )
+    var navBarHeight = WindowInsets.navigationBars.asPaddingValues().calculateBottomPadding()


    val scope = rememberCoroutineScope()
@@ -154,56 +157,63 @@ fun CommentModalContent(
            }

        }
-        Box(
+        Column(
            modifier = Modifier
                .fillMaxWidth()
                .background(Color(0xfff7f7f7))
-                .padding(horizontal = 16.dp)
-                .height(64.dp)
        ) {
-            Row(
+            Box(
                modifier = Modifier
                    .fillMaxWidth()
-                    .align(Alignment.Center),
-                verticalAlignment = Alignment.CenterVertically
+                    .padding(horizontal = 16.dp)
+                    .height(64.dp)
            ) {
-                // rounded
-                Box(
+                Row(
                    modifier = Modifier
                        .fillMaxWidth()
-                        .weight(1f)
-                        .clip(RoundedCornerShape(20.dp))
-                        .background(Color(0xffe5e5e5))
-                        .padding(horizontal = 16.dp, vertical = 12.dp)
-
+                        .align(Alignment.Center),
+                    verticalAlignment = Alignment.CenterVertically
                ) {
-                    BasicTextField(
-                        value = commentText,
-                        onValueChange = { text -> commentText = text },
+                    // rounded
+                    Box(
                        modifier = Modifier
-                            .fillMaxWidth(),
-                        textStyle = TextStyle(
-                            color = Color.Black,
-                            fontWeight = FontWeight.Normal
+                            .fillMaxWidth()
+                            .weight(1f)
+                            .clip(RoundedCornerShape(20.dp))
+                            .background(Color(0xffe5e5e5))
+                            .padding(horizontal = 16.dp, vertical = 12.dp)
+
+                    ) {
+                        BasicTextField(
+                            value = commentText,
+                            onValueChange = { text -> commentText = text },
+                            modifier = Modifier
+                                .fillMaxWidth(),
+                            textStyle = TextStyle(
+                                color = Color.Black,
+                                fontWeight = FontWeight.Normal
+                            )
                        )
-                    )

-                }
-                Spacer(modifier = Modifier.width(16.dp))
-                Image(
-                    painter = painterResource(id = R.drawable.rider_pro_send),
-                    contentDescription = "Send",
-                    modifier = Modifier
-                        .size(32.dp)
-                        .noRippleClickable {
-                            scope.launch {
-                                sendComment()
+                    }
+                    Spacer(modifier = Modifier.width(16.dp))
+                    Image(
+                        painter = painterResource(id = R.drawable.rider_pro_send),
+                        contentDescription = "Send",
+                        modifier = Modifier
+                            .size(32.dp)
+                            .noRippleClickable {
+                                scope.launch {
+                                    sendComment()
+                                }
                            }
-                        }
-                )
-            }
+                    )
+                }


+            }
+            Spacer(modifier = Modifier.height(navBarHeight))
+
        }


--- a/app/src/main/java/com/aiosman/riderpro/ui/composables/EditCommentBottomModal.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/EditCommentBottomModal.kt
@@ -3,15 +3,21 @@ package com.aiosman.riderpro.ui.composables
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 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.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.navigationBars
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.BasicTextField
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
@@ -19,6 +25,8 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.focus.FocusRequester
+import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.TextStyle
@@ -30,20 +38,24 @@ import com.aiosman.riderpro.ui.modifiers.noRippleClickable
@Composable
 fun EditCommentBottomModal(onSend: (String) -> Unit = {}) {
    var text by remember { mutableStateOf("") }
-    Box(
+    var navBarHeight = WindowInsets.navigationBars.asPaddingValues().calculateBottomPadding()
+    val focusRequester = remember { FocusRequester() }
+
+    LaunchedEffect(Unit) {
+        focusRequester.requestFocus()
+    }
+
+    Column(
        modifier = Modifier
            .fillMaxWidth()
            .background(Color(0xfff7f7f7))
            .padding(horizontal = 16.dp, vertical = 8.dp)
-
    ) {
        Row(
            modifier = Modifier
-                .fillMaxWidth()
-                .align(Alignment.Center),
+                .fillMaxWidth(),
            verticalAlignment = Alignment.CenterVertically
        ) {
-            // rounded
            Box(
                modifier = Modifier
                    .fillMaxWidth()
@@ -51,7 +63,6 @@ fun EditCommentBottomModal(onSend: (String) -> Unit = {}) {
                    .clip(RoundedCornerShape(20.dp))
                    .background(Color(0xffe5e5e5))
                    .padding(horizontal = 16.dp, vertical = 12.dp)
-
            ) {
                BasicTextField(
                    value = text,
@@ -59,14 +70,14 @@ fun EditCommentBottomModal(onSend: (String) -> Unit = {}) {
                        text = it
                    },
                    modifier = Modifier
-                        .fillMaxWidth(),
+                        .fillMaxWidth()
+                        .focusRequester(focusRequester),
                    textStyle = TextStyle(
                        color = Color.Black,
                        fontWeight = FontWeight.Normal
                    ),
                    minLines = 5
                )
-
            }
            Spacer(modifier = Modifier.width(16.dp))
            Image(
@@ -80,5 +91,6 @@ fun EditCommentBottomModal(onSend: (String) -> Unit = {}) {
                    },
            )
        }
+        Spacer(modifier = Modifier.height(navBarHeight))
    }
 }
--- a/app/src/main/java/com/aiosman/riderpro/ui/index/Index.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/index/Index.kt
@@ -56,7 +56,7 @@ fun IndexScreen() {
    val systemUiController = rememberSystemUiController()

    LaunchedEffect(Unit) {
-        systemUiController.setNavigationBarColor(Color.Black)
+        systemUiController.setNavigationBarColor(Color.Transparent)
    }
    Scaffold(
        bottomBar = {
--- 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
@@ -12,6 +12,7 @@ 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.WindowInsets
 import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.fillMaxHeight
@@ -495,7 +496,6 @@ fun MomentBottomOperateRowGroup(
    onShareClick: () -> Unit = {},
    momentEntity: MomentEntity
 ) {
-    var systemUiController = rememberSystemUiController()
    var showCommentModal by remember { mutableStateOf(false) }
    if (showCommentModal) {
        ModalBottomSheet(
@@ -503,14 +503,27 @@ fun MomentBottomOperateRowGroup(
            containerColor = Color.White,
            sheetState = rememberModalBottomSheetState(
                skipPartiallyExpanded = true
-            )
+            ),
+            windowInsets = WindowInsets(0),
+            dragHandle = {
+                Box(
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .height(56.dp)
+                        .clip(CircleShape)
+
+                ) {
+
+                }
+            }
+
        ) {
-            systemUiController.setNavigationBarColor(Color(0xfff7f7f7))
+//            systemUiController.setNavigationBarColor(Color(0xfff7f7f7))
            CommentModalContent(postId = momentEntity.id, onCommentAdded = {
                showCommentModal = false
                onAddComment()
            }) {
-                systemUiController.setNavigationBarColor(Color.Black)
+//                systemUiController.setNavigationBarColor(Color.Black)
            }
        }
    }
--- a/app/src/main/java/com/aiosman/riderpro/ui/post/NewPost.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/post/NewPost.kt
@@ -51,6 +51,7 @@ import androidx.lifecycle.viewModelScope
 import coil.compose.AsyncImage
 import com.aiosman.riderpro.LocalNavController
 import com.aiosman.riderpro.R
+import com.aiosman.riderpro.ui.NavigationRoute
 import com.aiosman.riderpro.ui.composables.CustomAsyncImage
 import com.aiosman.riderpro.ui.composables.RelPostCard
 import com.aiosman.riderpro.ui.composables.StatusBarMaskLayout
@@ -170,6 +171,7 @@ fun NewPostTextField(hint: String, value: String, onValueChange: (String) -> Uni
@OptIn(ExperimentalLayoutApi::class)
@Composable
 fun AddImageGrid() {
+    val navController = LocalNavController.current
    val context = LocalContext.current
    val model = NewPostViewModel

@@ -205,6 +207,8 @@ fun AddImageGrid() {

                        .drawBehind {
                            drawRoundRect(color = Color(0xFF999999), style = stroke)
+                        }.noRippleClickable {
+                            navController.navigate(NavigationRoute.NewPostImageGrid.route)
                        },
                    contentScale = ContentScale.Crop
                )
--- a/app/src/main/java/com/aiosman/riderpro/ui/post/NewPostImageGrid.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/post/NewPostImageGrid.kt
@@ -0,0 +1,120 @@
+package com.aiosman.riderpro.ui.post
+
+import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+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.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
+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.layout.size
+import androidx.compose.foundation.layout.systemBars
+import androidx.compose.foundation.pager.HorizontalPager
+import androidx.compose.foundation.pager.rememberPagerState
+import androidx.compose.material.Icon
+import androidx.compose.material.Text
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.automirrored.filled.ArrowBack
+import androidx.compose.material.icons.filled.Delete
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.derivedStateOf
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import coil.compose.rememberAsyncImagePainter
+import com.aiosman.riderpro.LocalNavController
+import com.aiosman.riderpro.ui.modifiers.noRippleClickable
+import com.google.accompanist.systemuicontroller.rememberSystemUiController
+
+@OptIn(ExperimentalFoundationApi::class)
+@Composable
+fun NewPostImageGridScreen() {
+    val model = NewPostViewModel
+    val imageList = model.imageUriList
+    val pagerState = rememberPagerState(pageCount = { imageList.size })
+    val systemUiController = rememberSystemUiController()
+    val paddingValues = WindowInsets.systemBars.asPaddingValues()
+    val navController = LocalNavController.current
+    val title = "${pagerState.currentPage + 1}/${imageList.size}"
+
+    LaunchedEffect(Unit) {
+        systemUiController.setStatusBarColor(Color.Transparent, darkIcons = false)
+    }
+    Box(
+        modifier = Modifier
+            .fillMaxSize()
+            .background(Color.Black)
+    ) {
+        Column {
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .background(Color(0xFF2e2e2e))
+                    .padding(horizontal = 16.dp, vertical = 16.dp)
+            ) {
+                Column {
+                    Spacer(modifier = Modifier.height(paddingValues.calculateTopPadding()))
+                    Row(
+                        verticalAlignment = Alignment.CenterVertically
+                    ) {
+                        Icon(
+                            Icons.AutoMirrored.Default.ArrowBack,
+                            contentDescription = "back",
+                            modifier = Modifier
+                                .size(24.dp)
+                                .noRippleClickable {
+                                    navController.popBackStack()
+                                },
+                            tint = Color.White
+                        )
+                        Text(
+                            title,
+                            color = Color.White,
+                            modifier = Modifier.weight(1f),
+                            textAlign = TextAlign.Center,
+                            fontSize = 18.sp,
+                        )
+                        Icon(
+                            Icons.Default.Delete,
+                            contentDescription = "delete",
+                            modifier = Modifier
+                                .size(24.dp)
+                                .noRippleClickable {
+                                    model.deleteImage(pagerState.currentPage)
+                                },
+                            tint = Color.White
+                        )
+                    }
+
+                }
+
+            }
+            HorizontalPager(
+                state = pagerState,
+            ) { page ->
+                val imageUrl = imageList[page]
+                Image(
+                    painter = rememberAsyncImagePainter(model = imageUrl),
+                    contentDescription = "Image $page",
+                    modifier = Modifier.fillMaxSize()
+                )
+            }
+        }
+
+
+    }
+
+
+}
--- a/app/src/main/java/com/aiosman/riderpro/ui/post/NewPostViewModel.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/post/NewPostViewModel.kt
@@ -73,4 +73,9 @@ object NewPostViewModel : ViewModel() {
            relMoment = moment
        }
    }
+    fun deleteImage(index: Int) {
+        imageUriList = imageUriList.toMutableList().apply {
+            removeAt(index)
+        }
+    }
 }
--- a/app/src/main/java/com/aiosman/riderpro/ui/post/Post.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/post/Post.kt
@@ -11,6 +11,7 @@ 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.WindowInsets
 import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
@@ -240,7 +241,7 @@ fun PostScreen(
    val scrollState = rememberLazyListState()
    val uiController = rememberSystemUiController()
    LaunchedEffect(Unit) {
-        uiController.setNavigationBarColor(Color.White)
+        uiController.setNavigationBarColor(Color.Transparent)
        viewModel.initData()
    }
    StatusBarMaskLayout {
@@ -606,7 +607,6 @@ fun BottomNavigationBar(
    onFavoriteClick: () -> Unit = {},
    momentEntity: MomentEntity?
 ) {
-    val systemUiController = rememberSystemUiController()
    var showCommentModal by remember { mutableStateOf(false) }
    if (showCommentModal) {
        ModalBottomSheet(
@@ -617,6 +617,7 @@ fun BottomNavigationBar(
            ),
            dragHandle = {},
            shape = RoundedCornerShape(topStart = 16.dp, topEnd = 16.dp),
+            windowInsets = WindowInsets(0)
        ) {
            EditCommentBottomModal() {
                onCreateComment(it)