更新多处动画行为

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()
+        }
     }
 
 

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,10 +157,14 @@ fun CommentModalContent(
             }
 
         }
-        Box(
+        Column(
             modifier = Modifier
                 .fillMaxWidth()
                 .background(Color(0xfff7f7f7))
+        ) {
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
                     .padding(horizontal = 16.dp)
                     .height(64.dp)
             ) {
@@ -205,6 +212,9 @@ fun CommentModalContent(
 
 
             }
+            Spacer(modifier = Modifier.height(navBarHeight))
+
+        }
 
 
     }

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()
+                .fillMaxWidth(),
-                .align(Alignment.Center),
             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))
     }
 }

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 = {

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)
             }
         }
     }

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
                 )

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()
+                )
+            }
+        }
+
+
+    }
+
+
+}

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)
+        }
+    }
 }

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)