更新 UI

2024-07-19 10:05:06 +08:00
parent e2e58ea955
commit baee6f66dc
16 changed files with 414 additions and 65 deletions
--- a/.idea/inspectionProfiles/Project_Default.xml
+++ b/.idea/inspectionProfiles/Project_Default.xml
@@ -1,6 +1,34 @@
 <component name="InspectionProjectProfileManager">
  <profile version="1.0">
    <option name="myName" value="Project Default" />
+    <inspection_tool class="ComposePreviewDimensionRespectsLimit" enabled="true" level="WARNING" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+      <option name="previewFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="ComposePreviewMustBeTopLevelFunction" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+      <option name="previewFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="ComposePreviewNeedsComposableAnnotation" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+      <option name="previewFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="ComposePreviewNotSupportedInUnitTestFiles" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+      <option name="previewFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="GlancePreviewDimensionRespectsLimit" enabled="true" level="WARNING" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="GlancePreviewMustBeTopLevelFunction" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="GlancePreviewNeedsComposableAnnotation" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="GlancePreviewNotSupportedInUnitTestFiles" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+    </inspection_tool>
    <inspection_tool class="PreviewAnnotationInFunctionWithParameters" enabled="true" level="ERROR" enabled_by_default="true">
      <option name="composableFile" value="true" />
      <option name="previewFile" value="true" />
--- a/app/src/main/java/com/aiosman/riderpro/AddModification.kt
+++ b/app/src/main/java/com/aiosman/riderpro/AddModification.kt
@@ -2,6 +2,7 @@ package com.aiosman.riderpro

 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -13,9 +14,16 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.text.BasicTextField
+import androidx.compose.foundation.text.KeyboardActions
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ModalBottomSheet
 import androidx.compose.material3.Text
+import androidx.compose.material3.rememberModalBottomSheetState
 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
@@ -23,11 +31,16 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.drawBehind
-import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.focus.FocusRequester
+import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.PathEffect
+import androidx.compose.ui.graphics.RectangleShape
 import androidx.compose.ui.graphics.drawscope.Stroke
+import androidx.compose.ui.platform.LocalSoftwareKeyboardController
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.input.ImeAction
+import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
@@ -35,6 +48,7 @@ import androidx.compose.ui.unit.sp
@Preview
@Composable
 fun EditModification() {
+    val model = NewPostViewModel
    Column(
        modifier = Modifier
            .fillMaxSize()
@@ -44,28 +58,62 @@ fun EditModification() {
            modifier = Modifier.padding(vertical = 16.dp, horizontal = 18.dp)
        ) {
            NoticeScreenHeader("Modification List")
-
        }
        LazyColumn(
            modifier = Modifier.padding(start = 24.dp, end = 24.dp, top = 16.dp)
        ) {
-            item {
-                repeat(2) {
-                    AddModificationItem()
-                    Spacer(modifier = Modifier.height(16.dp))
+            items(model.modificationList) { mod ->
+                AddModificationItem(mod) { updatedMod ->
+                    model.modificationList = model.modificationList.map { existingMod ->
+                        if (existingMod.key == updatedMod.key) updatedMod else existingMod
+                    }.toMutableList()
+                }
+                Spacer(modifier = Modifier.height(16.dp))
+            }
+            item {
+                AddModificationButton {
+                    model.modificationList += Modification(
+                        key = Utils.generateRandomString(4),
+                        name = "",
+                        price = "0.0"
+                    )
                }
-                AddModificationButton()
            }
-
        }
-
-
    }
 }

+data class Modification(
+    val key: String,
+    val name: String,
+    val price: String
+)
+
+@OptIn(ExperimentalMaterial3Api::class)
@Composable
-fun AddModificationItem() {
-    var text by remember { mutableStateOf("") }
+fun AddModificationItem(modification: Modification, onUpdate: (Modification) -> Unit) {
+    var isEditPriceBottomModalVisible by remember { mutableStateOf(false) }
+    if (isEditPriceBottomModalVisible) {
+        ModalBottomSheet(
+            onDismissRequest = {
+                isEditPriceBottomModalVisible = false
+            },
+            containerColor = Color.White,
+            sheetState = rememberModalBottomSheetState(
+                skipPartiallyExpanded = true
+            ),
+            dragHandle = {},
+            scrimColor = Color.Transparent,
+            shape = RectangleShape
+        ) {
+            EditPriceBottomModal {
+                isEditPriceBottomModalVisible = false
+                onUpdate(
+                    modification.copy(price = it)
+                )
+            }
+        }
+    }
    Column {
        Box(
            modifier = Modifier
@@ -74,14 +122,16 @@ fun AddModificationItem() {
                .padding(vertical = 13.dp, horizontal = 16.dp),


-        ) {
-            if (text.isEmpty()) {
+            ) {
+            if (modification.name.isEmpty()) {
                Text("Please enter the name", fontSize = 14.sp, color = Color(0xFFd6d6d6))
            }
            BasicTextField(
-                value = text,
+                value = modification.name,
                onValueChange = {
-                    text = it
+                    onUpdate(
+                        modification.copy(name = it)
+                    )
                },
                modifier = Modifier
                    .fillMaxWidth()
@@ -94,13 +144,16 @@ fun AddModificationItem() {
                .fillMaxWidth()
                .background(Color.White)
                .padding(top = 13.dp, bottom = 13.dp, start = 16.dp, end = 8.dp)
+                .clickable {
+                    isEditPriceBottomModalVisible = true
+                }
        ) {
            Row(
                verticalAlignment = Alignment.CenterVertically
            ) {
                Text("Price", fontSize = 16.sp)
                Spacer(modifier = Modifier.weight(1f))
-                Text("$74.00", fontSize = 16.sp, color = Color(0xffda3832))
+                Text(modification.price, fontSize = 16.sp, color = Color(0xffda3832))
                Spacer(modifier = Modifier.width(6.dp))
                Image(
                    painter = painterResource(id = R.drawable.rider_pro_nav_next),
@@ -113,7 +166,7 @@ fun AddModificationItem() {
 }

@Composable
-fun AddModificationButton() {
+fun AddModificationButton(onClick: () -> Unit = {}) {
    val stroke = Stroke(
        width = 2f,
        pathEffect = PathEffect.dashPathEffect(floatArrayOf(10f, 10f), 0f)
@@ -125,6 +178,9 @@ fun AddModificationButton() {
            .drawBehind {
                drawRoundRect(color = Color(0xFFd6d6d6), style = stroke)
            }
+            .clickable {
+                onClick()
+            }
    ) {
        Image(
            painter = painterResource(id = R.drawable.rider_pro_new_post_add_pic),
@@ -134,4 +190,48 @@ fun AddModificationButton() {
                .align(Alignment.Center),
        )
    }
+}
+
+@Composable
+fun EditPriceBottomModal(onOkClick: (String) -> Unit = {}) {
+    val focusRequester = remember { FocusRequester() }
+    val keyboardController = LocalSoftwareKeyboardController.current
+
+    var text by remember { mutableStateOf("") }
+
+
+    LaunchedEffect(Unit) {
+        focusRequester.requestFocus()
+    }
+
+
+    // Modal content including BasicTextField
+    Row(
+        modifier = Modifier
+            .fillMaxWidth()
+            .background(Color.White)
+            .padding(16.dp)
+    ) {
+        Text("Price", fontSize = 16.sp)
+        Spacer(modifier = Modifier.width(16.dp))
+        BasicTextField(
+            value = text,
+            onValueChange = { text = it },
+            modifier = Modifier
+                .fillMaxWidth()
+                .focusRequester(focusRequester),
+            keyboardOptions = KeyboardOptions(
+                keyboardType = KeyboardType.Number,
+                imeAction = ImeAction.Done
+            ),
+            singleLine = true,
+            keyboardActions = KeyboardActions(
+                onDone = {
+                    keyboardController?.hide()
+                    // Logic to close the dialog/modal
+                    onOkClick(text)
+                }
+            ),
+        )
+    }
 }
--- a/app/src/main/java/com/aiosman/riderpro/AddPage.kt
+++ b/app/src/main/java/com/aiosman/riderpro/AddPage.kt
@@ -32,6 +32,7 @@ fun AddPage(){
        .fillMaxSize()
        .background(Color.Black)) {
        AddBtn(icon = R.drawable.rider_pro_icon_rider_share, text = "Rider Share") {
+            NewPostViewModel.asNewPost()
            navController.navigate("NewPost")
        }
        AddBtn(icon = R.drawable.rider_pro_location_create, text = "Location Create")
--- a/app/src/main/java/com/aiosman/riderpro/CommentsScreen.kt
+++ b/app/src/main/java/com/aiosman/riderpro/CommentsScreen.kt
@@ -2,6 +2,7 @@ package com.aiosman.riderpro

 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -61,6 +62,7 @@ fun CommentsScreen() {
 fun NoticeScreenHeader(
    title:String
 ) {
+    val nav = LocalNavController.current
    Row(
        modifier = Modifier.fillMaxWidth(),
        verticalAlignment = Alignment.CenterVertically,
@@ -68,7 +70,9 @@ fun NoticeScreenHeader(
        Image(
            painter = painterResource(id = R.drawable.rider_pro_nav_back),
            contentDescription = title,
-            modifier = Modifier.size(16.dp)
+            modifier = Modifier.size(16.dp).clickable {
+                nav.popBackStack()
+            }
        )
        Spacer(modifier = Modifier.size(12.dp))
        Text(title, fontWeight = FontWeight.Bold, fontSize = 17.sp)
--- a/app/src/main/java/com/aiosman/riderpro/IndexViewModel.kt
+++ b/app/src/main/java/com/aiosman/riderpro/IndexViewModel.kt
@@ -0,0 +1,10 @@
+package com.aiosman.riderpro
+
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.lifecycle.ViewModel
+
+object IndexViewModel:ViewModel() {
+    var tabIndex by mutableStateOf(0)
+}
--- a/app/src/main/java/com/aiosman/riderpro/MainActivity.kt
+++ b/app/src/main/java/com/aiosman/riderpro/MainActivity.kt
@@ -5,6 +5,7 @@ import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
+import androidx.compose.animation.animateColorAsState
 import androidx.compose.animation.core.tween
 import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
@@ -35,6 +36,7 @@ import androidx.compose.material3.TabRow
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.compositionLocalOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -49,6 +51,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.core.view.WindowCompat
 import androidx.navigation.NavGraph
+import androidx.navigation.NavGraph.Companion.findStartDestination
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
@@ -85,28 +88,31 @@ fun NavigationController(navController: NavHostController) {
    }
    NavHost(
        navController = navController,
-        startDestination = NavigationItem.Home.route,
+        startDestination = "Index",
    ) {
        // 带底部导航栏的路由：
-        listOf(
-            NavigationItem.Home,
-            NavigationItem.Street,
-            NavigationItem.Add,
-            NavigationItem.Message,
-            NavigationItem.Profile
-        ).forEach { item ->
-            composable(route = item.route) {
-                ScaffoldWithNavigationBar(navController) {
-                    when (item) {
-                        NavigationItem.Home -> Home()
-                        NavigationItem.Street -> Street()
-                        NavigationItem.Add -> Add()
-                        NavigationItem.Message -> Video()
-                        NavigationItem.Profile -> Profile()
-                        else -> {} // 由于过滤，这里不会发生
-                    }
-                }
-            }
+//        listOf(
+//            NavigationItem.Home,
+//            NavigationItem.Street,
+//            NavigationItem.Add,
+//            NavigationItem.Message,
+//            NavigationItem.Profile
+//        ).forEach { item ->
+//            composable(route = item.route) {
+//                ScaffoldWithNavigationBar(navController) {
+//                    when (item) {
+//                        NavigationItem.Home -> Home()
+//                        NavigationItem.Street -> Street()
+//                        NavigationItem.Add -> Add()
+//                        NavigationItem.Message -> Video()
+//                        NavigationItem.Profile -> Profile()
+//                        else -> {} // 由于过滤，这里不会发生
+//                    }
+//                }
+//            }
+//        }
+        composable(route = "Index") {
+            ScaffoldWithNavigationBar2()
        }
        composable(route = "ProfileTimeline") {
            GalleryPage()
@@ -126,7 +132,7 @@ fun NavigationController(navController: NavHostController) {
        }
        composable(route = "Post") {

-                PostPage()
+            PostPage()

        }
        composable(route = "ModificationList") {
@@ -149,9 +155,7 @@ fun NavigationController(navController: NavHostController) {
            FollowerPage()
        }
        composable(route = "NewPost") {
-
            NewPostScreen()
-
        }
        composable(route = "EditModification") {
            Box(
@@ -200,6 +204,11 @@ fun ScaffoldWithNavigationBar(
                val currentRoute = navBackStackEntry?.destination?.route
                val systemUiController = rememberSystemUiController()
                item.forEach { it ->
+                    val isSelected = currentRoute == it.route
+                    val iconTint by animateColorAsState(
+                        targetValue = if (isSelected) Color.Red else Color.White,
+                        animationSpec = tween(durationMillis = 250), label = ""
+                    )
                    NavigationBarItem(
                        selected = currentRoute == it.route,
                        onClick = {
@@ -232,20 +241,20 @@ fun ScaffoldWithNavigationBar(
                            }
                        },
                        colors = NavigationBarItemColors(
-                            selectedIconColor = Color.Red,
                            selectedTextColor = Color.Red,
                            selectedIndicatorColor = Color.Black,
-                            unselectedIconColor = Color.Red,
                            unselectedTextColor = Color.Red,
                            disabledIconColor = Color.Red,
                            disabledTextColor = Color.Red,
-
-                            ),
+                            selectedIconColor = iconTint,
+                            unselectedIconColor = iconTint,
+                        ),
                        icon = {
                            Icon(
                                modifier = Modifier.size(24.dp),
-                                imageVector = it.icon(), contentDescription = null,
-                                tint = if (currentRoute == it.route) Color.Red else Color.White
+                                imageVector = if (currentRoute == it.route) it.selectedIcon() else it.icon(),
+                                contentDescription = null,
+                                tint = iconTint
                            )
                        }
                    )
@@ -263,10 +272,102 @@ fun ScaffoldWithNavigationBar(
 }

@Composable
-fun Home() {
+fun ScaffoldWithNavigationBar2(
+) {
+    val model = IndexViewModel
    val navigationBarHeight = with(LocalDensity.current) {
        WindowInsets.navigationBars.getBottom(this).toDp()
    }
+    val item = listOf(
+        NavigationItem.Home,
+        NavigationItem.Street,
+        NavigationItem.Add,
+        NavigationItem.Message,
+        NavigationItem.Profile
+    )
+    val systemUiController = rememberSystemUiController()
+
+    LaunchedEffect(Unit) {
+        systemUiController.setNavigationBarColor(Color.Black)
+    }
+    Scaffold(
+        bottomBar = {
+            NavigationBar(
+                modifier = Modifier.height(56.dp + navigationBarHeight),
+                containerColor = Color.Black
+            ) {
+                item.forEachIndexed { idx, it ->
+                    val isSelected = model.tabIndex == idx
+                    val iconTint by animateColorAsState(
+                        targetValue = if (isSelected) Color.Red else Color.White,
+                        animationSpec = tween(durationMillis = 250), label = ""
+                    )
+                    NavigationBarItem(
+                        selected = isSelected,
+                        onClick = {
+                            model.tabIndex = idx
+//                            if (it.route == NavigationItem.Add.route || it.route == NavigationItem.Message.route) {
+//                                systemUiController.setStatusBarColor(Color.Black, darkIcons = false)
+//                            } else {
+//                                systemUiController.setStatusBarColor(
+//                                    Color.Transparent,
+//                                    darkIcons = true
+//                                )
+//                            }
+                        },
+                        colors = NavigationBarItemColors(
+                            selectedTextColor = Color.Red,
+                            selectedIndicatorColor = Color.Black,
+                            unselectedTextColor = Color.Red,
+                            disabledIconColor = Color.Red,
+                            disabledTextColor = Color.Red,
+                            selectedIconColor = iconTint,
+                            unselectedIconColor = iconTint,
+                        ),
+                        icon = {
+                            Icon(
+                                modifier = Modifier.size(24.dp),
+                                imageVector = if (isSelected) it.selectedIcon() else it.icon(),
+                                contentDescription = null,
+                                tint = iconTint
+                            )
+                        }
+                    )
+                }
+
+            }
+        }
+    ) { innerPadding ->
+        Box(
+            modifier = Modifier
+        ) {
+            when (model.tabIndex) {
+                0 -> Box(
+                    modifier = Modifier.padding(innerPadding)
+                ) { Home() }
+                1 -> Street()
+                2 -> Box(
+                    modifier = Modifier.padding(innerPadding)
+                ) { Add() }
+
+                3 -> Box(
+                    modifier = Modifier.padding(innerPadding)
+                ) { Video() }
+
+                4 -> Box(
+                    modifier = Modifier.padding(innerPadding)
+                ) { Profile() }
+            }
+        }
+    }
+}
+
+@Composable
+fun Home() {
+    val systemUiController = rememberSystemUiController()
+    LaunchedEffect(Unit) {
+        systemUiController.setStatusBarColor(Color.Transparent, darkIcons = true)
+    }
    Column(
        modifier = Modifier
            .fillMaxSize(),
@@ -280,8 +381,9 @@ fun Home() {

@Composable
 fun Street() {
-    val navigationBarHeight = with(LocalDensity.current) {
-        WindowInsets.navigationBars.getBottom(this).toDp()
+    val systemUiController = rememberSystemUiController()
+    LaunchedEffect(Unit) {
+        systemUiController.setStatusBarColor(Color.Transparent, darkIcons = true)
    }
    Column(
        modifier = Modifier
@@ -295,8 +397,9 @@ fun Street() {

@Composable
 fun Add() {
-    val navigationBarHeight = with(LocalDensity.current) {
-        WindowInsets.navigationBars.getBottom(this).toDp()
+    val systemUiController = rememberSystemUiController()
+    LaunchedEffect(Unit) {
+        systemUiController.setStatusBarColor(Color.Black, darkIcons = false)
    }
    Column(
        modifier = Modifier
@@ -311,8 +414,9 @@ fun Add() {

@Composable
 fun Video() {
-    val navigationBarHeight = with(LocalDensity.current) {
-        WindowInsets.navigationBars.getBottom(this).toDp()
+    val systemUiController = rememberSystemUiController()
+    LaunchedEffect(Unit) {
+        systemUiController.setStatusBarColor(Color.Black, darkIcons = false)
    }
    Column(
        modifier = Modifier
@@ -341,8 +445,9 @@ fun Message() {

@Composable
 fun Profile() {
-    val navigationBarHeight = with(LocalDensity.current) {
-        WindowInsets.navigationBars.getBottom(this).toDp()
+    val systemUiController = rememberSystemUiController()
+    LaunchedEffect(Unit) {
+        systemUiController.setStatusBarColor(Color.Transparent, darkIcons = true)
    }
    Column(
        modifier = Modifier
--- a/app/src/main/java/com/aiosman/riderpro/NavigationItem.kt
+++ b/app/src/main/java/com/aiosman/riderpro/NavigationItem.kt
@@ -9,15 +9,33 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.res.vectorResource

-sealed class NavigationItem(val route:String, val icon: @Composable () -> ImageVector){
+sealed class NavigationItem(
+    val route: String,
+    val icon: @Composable () -> ImageVector,
+    val selectedIcon: @Composable () -> ImageVector = icon
+) {
    data object Home : NavigationItem("Home",
-        { ImageVector.vectorResource(R.drawable.rider_pro_home) })
+        icon = { ImageVector.vectorResource(R.drawable.rider_pro_home) },
+        selectedIcon = { ImageVector.vectorResource(R.drawable.rider_pro_home_filed) }
+    )
+
    data object Street : NavigationItem("Street",
-        { ImageVector.vectorResource(R.drawable.rider_pro_street) })
+        icon = { ImageVector.vectorResource(R.drawable.rider_pro_location) },
+        selectedIcon = { ImageVector.vectorResource(R.drawable.rider_pro_location_filed) }
+    )
+
    data object Add : NavigationItem("Add",
-        { ImageVector.vectorResource(R.drawable.rider_pro_moment_add) })
+        icon = { ImageVector.vectorResource(R.drawable.rider_pro_moment_add) },
+        selectedIcon = { ImageVector.vectorResource(R.drawable.rider_pro_moment_add) }
+    )
+
    data object Message : NavigationItem("Message",
-        { ImageVector.vectorResource(R.drawable.rider_pro_video) })
+        icon = { ImageVector.vectorResource(R.drawable.rider_pro_video_outline) },
+        selectedIcon = { ImageVector.vectorResource(R.drawable.rider_pro_video) }
+    )
+
    data object Profile : NavigationItem("Profile",
-        { ImageVector.vectorResource(R.drawable.rider_pro_profile) })
+        icon = { ImageVector.vectorResource(R.drawable.rider_pro_profile) },
+        selectedIcon = { ImageVector.vectorResource(R.drawable.rider_pro_profile_filed) }
+    )
 }
--- a/app/src/main/java/com/aiosman/riderpro/NewPost.kt
+++ b/app/src/main/java/com/aiosman/riderpro/NewPost.kt
@@ -16,6 +16,7 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -302,6 +303,7 @@ fun SelectedLocation(
                    .padding(end = 16.dp)
            ) {
                Text(searchPlaceAddressResult.name, fontWeight = FontWeight.Bold)
+                Spacer(modifier = Modifier.height(4.dp))
                Text(searchPlaceAddressResult.address, color = Color(0xFF9a9a9a))
            }
            Image(
--- a/app/src/main/java/com/aiosman/riderpro/NewPostViewModel.kt
+++ b/app/src/main/java/com/aiosman/riderpro/NewPostViewModel.kt
@@ -5,7 +5,15 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.setValue
 import androidx.lifecycle.ViewModel

+
 object NewPostViewModel : ViewModel() {
    var textContent by mutableStateOf("")
    var searchPlaceAddressResult by mutableStateOf<SearchPlaceAddressResult?>(null)
+    var modificationList by mutableStateOf<List<Modification>>(listOf())
+
+    fun asNewPost() {
+        textContent = ""
+        searchPlaceAddressResult = null
+        modificationList = listOf()
+    }
 }
--- a/app/src/main/java/com/aiosman/riderpro/SelectLocationModal.kt
+++ b/app/src/main/java/com/aiosman/riderpro/SelectLocationModal.kt
@@ -16,6 +16,8 @@ import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.BasicTextField
+import androidx.compose.foundation.text.KeyboardActions
+import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -27,8 +29,10 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalSoftwareKeyboardController
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
@@ -124,6 +128,8 @@ fun LocationSearchTextInput(
    onQueryClick: () -> Unit,
    onValueChange: (String) -> Unit
 ) {
+    val keyboardController = LocalSoftwareKeyboardController.current
+
    Box(
        modifier = Modifier
            .fillMaxWidth()
@@ -143,7 +149,6 @@ fun LocationSearchTextInput(
                contentDescription = "Search",
                modifier = Modifier
                    .size(24.dp)
-                    .clickable { onQueryClick() }
            )
            Spacer(modifier = Modifier.width(8.dp))
            if (value.isEmpty()) {
@@ -158,7 +163,18 @@ fun LocationSearchTextInput(
                onValueChange = onValueChange,
                modifier = Modifier
                    .fillMaxWidth()
-                    .padding(vertical = 16.dp)
+                    .padding(vertical = 16.dp),
+                keyboardOptions = KeyboardOptions(
+                    imeAction = ImeAction.Search
+                ),
+                keyboardActions = KeyboardActions(
+                    onSearch = {
+                        onQueryClick()
+                        // hide keyboard
+                        keyboardController?.hide()
+
+                    }
+                )

            )
        }
--- a/app/src/main/java/com/aiosman/riderpro/Utils.kt
+++ b/app/src/main/java/com/aiosman/riderpro/Utils.kt
@@ -0,0 +1,10 @@
+package com.aiosman.riderpro
+
+object Utils {
+    fun generateRandomString(length: Int): String {
+        val allowedChars = ('A'..'Z') + ('a'..'z') + ('0'..'9')
+        return (1..length)
+            .map { allowedChars.random() }
+            .joinToString("")
+    }
+}
--- a/app/src/main/res/drawable/rider_pro_home_filed.xml
+++ b/app/src/main/res/drawable/rider_pro_home_filed.xml
@@ -0,0 +1,5 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:alpha="0.77" android:height="24dp" android:viewportHeight="24" android:viewportWidth="24" android:width="24dp">
+      
+    <path android:fillColor="#FFFFFF" android:fillType="evenOdd" android:pathData="M12.614,1.211L21.614,8.211C21.858,8.4 22,8.691 22,9L22,20C22,21.657 20.657,23 19,23L15,23L15,12L9,12L9,23L5,23C3.343,23 2,21.657 2,20L2,9C2,8.691 2.142,8.4 2.386,8.211L11.386,1.211C11.747,0.93 12.253,0.93 12.614,1.211Z" android:strokeColor="#00000000" android:strokeWidth="1"/>
+    
+</vector>
--- a/app/src/main/res/drawable/rider_pro_location.xml
+++ b/app/src/main/res/drawable/rider_pro_location.xml
@@ -0,0 +1,11 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:alpha="0.77" android:height="24dp" android:viewportHeight="24" android:viewportWidth="25" android:width="25dp">
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M12.5,12m-9,0a9,9 0,1 1,18 0a9,9 0,1 1,-18 0" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.93476923"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M20.581,15.975L15.491,12.844C15.403,12.787 15.304,12.752 15.2,12.741L13.053,12.45C12.724,12.403 12.404,12.584 12.275,12.891L10.991,15.769C10.867,16.042 10.919,16.363 11.122,16.584L12.884,18.487C13.046,18.665 13.115,18.908 13.072,19.144L12.706,21" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.93476923"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M6.594,5.213L5.75,7.2C5.677,7.376 5.673,7.574 5.741,7.753L6.819,10.622C6.904,10.865 7.11,11.046 7.363,11.1L9.369,11.531C9.595,11.577 9.786,11.726 9.884,11.934L10.241,12.675C10.37,12.93 10.63,13.093 10.916,13.097L12.181,13.097" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.93476923"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M14.797,3.291L15.669,4.866C15.834,5.17 15.773,5.548 15.519,5.784L12.997,8.063C12.955,8.103 12.907,8.137 12.856,8.166L11.703,8.803C11.593,8.861 11.471,8.894 11.347,8.897L9.341,8.897C9.039,8.898 8.766,9.079 8.647,9.356L7.869,11.203" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.93476923"/>
+    
+</vector>
--- a/app/src/main/res/drawable/rider_pro_location_filed.xml
+++ b/app/src/main/res/drawable/rider_pro_location_filed.xml
@@ -0,0 +1,13 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:alpha="0.77" android:height="24dp" android:viewportHeight="24" android:viewportWidth="25" android:width="25dp">
+      
+    <path android:fillColor="#FFFFFF" android:fillType="nonZero" android:pathData="M21.275,16.247C21.92,14.924 22.253,13.471 22.25,12C22.244,7.585 19.277,3.722 15.012,2.578L14.966,2.578C11.878,1.765 8.589,2.519 6.162,4.594L6.041,4.706C3.002,7.388 1.941,11.671 3.378,15.461C4.814,19.251 8.447,21.756 12.5,21.75L12.725,21.75C16.332,21.661 19.597,19.592 21.219,16.369L21.219,16.369L21.275,16.247ZM20.75,12C20.748,12.982 20.574,13.956 20.234,14.878L15.884,12.206C15.705,12.093 15.504,12.02 15.294,11.991L13.156,11.709C12.597,11.637 12.043,11.883 11.722,12.347L10.916,12.347L10.559,11.606C10.357,11.192 9.978,10.892 9.528,10.791L8.909,10.659L9.144,10.106C9.263,9.829 9.535,9.648 9.837,9.647L11.347,9.647C11.599,9.646 11.848,9.581 12.069,9.459L13.212,8.822C13.313,8.767 13.408,8.701 13.494,8.625L16.016,6.338C16.465,5.944 16.631,5.318 16.438,4.753C19.094,6.196 20.749,8.977 20.75,12ZM4.25,12C4.248,10.706 4.553,9.431 5.141,8.278L6.116,10.894C6.297,11.37 6.706,11.722 7.203,11.831L7.719,11.944L7.728,11.944L8.853,12.188C9.079,12.233 9.27,12.383 9.369,12.591L9.566,13.003C9.819,13.518 10.342,13.845 10.916,13.847L11.028,13.847L10.306,15.459C10.057,16.006 10.16,16.65 10.569,17.091L12.078,18.722C12.236,18.898 12.305,19.136 12.266,19.369L12.097,20.241C7.704,20.021 4.254,16.398 4.25,12Z" android:strokeColor="#00000000" android:strokeWidth="1"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M12.5,12m-9,0a9,9 0,1 1,18 0a9,9 0,1 1,-18 0" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.93476923"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M20.581,15.975L15.491,12.844C15.403,12.787 15.304,12.752 15.2,12.741L13.053,12.45C12.724,12.403 12.404,12.584 12.275,12.891L10.991,15.769C10.867,16.042 10.919,16.363 11.122,16.584L12.884,18.487C13.046,18.665 13.115,18.908 13.072,19.144L12.706,21" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.93476923"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M6.594,5.213L5.75,7.2C5.677,7.376 5.673,7.574 5.741,7.753L6.819,10.622C6.904,10.865 7.11,11.046 7.363,11.1L9.369,11.531C9.595,11.577 9.786,11.726 9.884,11.934L10.241,12.675C10.37,12.93 10.63,13.093 10.916,13.097L12.181,13.097" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.93476923"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M14.797,3.291L15.669,4.866C15.834,5.17 15.773,5.548 15.519,5.784L12.997,8.063C12.955,8.103 12.907,8.137 12.856,8.166L11.703,8.803C11.593,8.861 11.471,8.894 11.347,8.897L9.341,8.897C9.039,8.898 8.766,9.079 8.647,9.356L7.869,11.203" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.93476923"/>
+    
+</vector>
--- a/app/src/main/res/drawable/rider_pro_profile_filed.xml
+++ b/app/src/main/res/drawable/rider_pro_profile_filed.xml
@@ -0,0 +1,5 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:alpha="0.77" android:height="24dp" android:viewportHeight="24" android:viewportWidth="24" android:width="24dp">
+      
+    <path android:fillColor="#FFFFFF" android:fillType="nonZero" android:pathData="M21.741,19.875C20.341,17.464 18.101,15.655 15.45,14.794C18.062,13.241 19.314,10.133 18.509,7.203C17.703,4.273 15.039,2.242 12,2.242C8.961,2.242 6.297,4.273 5.491,7.203C4.686,10.133 5.938,13.241 8.55,14.794C5.899,15.655 3.659,17.464 2.259,19.875C2.119,20.105 2.119,20.395 2.259,20.625C2.39,20.859 2.638,21.003 2.906,21L21.094,21C21.362,21.003 21.61,20.859 21.741,20.625C21.881,20.395 21.881,20.105 21.741,19.875L21.741,19.875Z" android:strokeColor="#00000000" android:strokeWidth="1"/>
+    
+</vector>
--- a/app/src/main/res/drawable/rider_pro_video_outline.xml
+++ b/app/src/main/res/drawable/rider_pro_video_outline.xml
@@ -0,0 +1,13 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:alpha="0.77" android:height="24dp" android:viewportHeight="24" android:viewportWidth="25" android:width="25dp">
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M4.336,11.314L21.5,11.314L21.5,20.193C21.5,20.639 21.151,21 20.72,21L5.116,21C4.685,21 4.336,20.639 4.336,20.193L4.336,11.314Z" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.53783776"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M4.336,11.314L20.915,6.713L20.105,3.595C20.053,3.388 19.922,3.211 19.742,3.105C19.563,2.999 19.349,2.972 19.15,3.03L4.082,7.207C3.882,7.262 3.71,7.397 3.606,7.582C3.501,7.768 3.473,7.989 3.526,8.196L4.336,11.314Z" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.53783776"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M13.123,4.695L17.901,7.55" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.53783776"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M6.345,6.582L11.114,9.437" android:strokeColor="#FFFFFF" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.53783776"/>
+      
+    <path android:fillColor="#FFFFFF" android:fillType="nonZero" android:pathData="M12.036,19C12.106,19 12.176,18.988 12.246,18.963C12.315,18.938 12.393,18.898 12.48,18.844L16.074,16.606C16.213,16.518 16.319,16.428 16.391,16.336C16.464,16.243 16.5,16.131 16.5,15.998C16.5,15.867 16.464,15.755 16.391,15.662C16.319,15.569 16.213,15.48 16.074,15.394L12.48,13.154C12.393,13.1 12.315,13.061 12.246,13.036C12.176,13.012 12.106,13 12.036,13C11.891,13 11.765,13.057 11.659,13.17C11.553,13.283 11.5,13.44 11.5,13.642L11.5,18.357C11.5,18.558 11.553,18.716 11.659,18.829C11.765,18.943 11.891,19 12.036,19Z" android:strokeColor="#00000000" android:strokeWidth="1"/>
+    
+</vector>