add:comment modal

app/src/main/java/com/aiosman/riderpro/CommentModal.kt

@@ -0,0 +1,119 @@
+package com.aiosman.riderpro
+
+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.fillMaxWidth
+import androidx.compose.foundation.layout.height
+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.material3.HorizontalDivider
+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.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+
+
+@Preview
+@Composable
+fun CommentModalContent() {
+    Column(
+        modifier = Modifier
+
+    ) {
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(start = 16.dp, bottom = 16.dp, end = 16.dp)
+
+        ) {
+            Text(
+                "评论",
+                fontSize = 20.sp,
+                fontWeight = FontWeight.Bold,
+                modifier = Modifier.align(Alignment.Center)
+            )
+        }
+
+        HorizontalDivider(
+            color = Color(0xFFF7F7F7)
+        )
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(horizontal = 16.dp)
+                .weight(1f)
+        ) {
+            CommentsSection()
+        }
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(Color(0xfff7f7f7))
+                .padding(horizontal = 16.dp)
+                .height(64.dp)
+        ) {
+            Row(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .align(Alignment.Center),
+                verticalAlignment = Alignment.CenterVertically
+            ) {
+                // rounded
+                Box(
+                    modifier = Modifier
+                        .fillMaxWidth()
+
+
+                        .weight(1f)
+                        .clip(RoundedCornerShape(20.dp))
+                        .background(Color(0xffe5e5e5))
+                        .padding(horizontal = 16.dp, vertical = 12.dp)
+
+                ) {
+                    BasicTextField(
+                        value = "",
+                        onValueChange = { },
+                        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)
+
+                )
+            }
+
+
+        }
+
+
+
+    }
+
+}
+
+

app/src/main/java/com/aiosman/riderpro/PagingSimple.kt

@@ -24,11 +24,16 @@ import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Build
 import androidx.compose.material3.CircularProgressIndicator
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.LocalTextStyle
+import androidx.compose.material3.ModalBottomSheet
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -267,8 +272,18 @@ fun MomentOperateBtn(@DrawableRes icon: Int, count: String) {
     }
 }
 
+@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun MomentBottomOperateRowGroup(modifier: Modifier) {
+    var showCommentModal by remember { mutableStateOf(false) }
+    if (showCommentModal) {
+        ModalBottomSheet(
+            onDismissRequest = { showCommentModal = false },
+            containerColor = Color.White
+        ) {
+            CommentModalContent()
+        }
+    }
     Row(
         modifier = Modifier
             .fillMaxWidth()
@@ -281,7 +296,9 @@ fun MomentBottomOperateRowGroup(modifier: Modifier) {
             MomentOperateBtn(icon = R.drawable.rider_pro_like, count = "21")
         }
         Box(
-            modifier = modifier,
+            modifier = modifier.clickable {
+                showCommentModal = true
+            },
             contentAlignment = Alignment.Center
         ) {
             MomentOperateBtn(icon = R.drawable.rider_pro_moment_comment, count = "43")

app/src/main/res/drawable/rider_pro_send.xml

@@ -0,0 +1,22 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M12,12m-12,0a12,12 0,1 1,24 0a12,12 0,1 1,-24 0"
+      android:strokeWidth="1"
+      android:fillColor="#ED1C24"
+      android:fillType="evenOdd"
+      android:strokeColor="#00000000"/>
+  <group>
+    <clip-path
+        android:pathData="M12,12m-12,0a12,12 0,1 1,24 0a12,12 0,1 1,-24 0"/>
+    <path
+        android:pathData="M12,11L18,15.5L18,19L12,14.5L6,19L6,15.5L12,11ZM12,5L18,9.5L18,13L12,8.5L6,13L6,9.5L12,5Z"
+        android:strokeWidth="1"
+        android:fillColor="#FFFFFF"
+        android:fillType="evenOdd"
+        android:strokeColor="#00000000"/>
+  </group>
+</vector>