Browse Source

Worked on new item forms Ui adjustment and remove textfield focus if clicked on screen

Khubaib 6 months ago
parent
commit
e93618ef50

+ 16 - 16
app/src/main/java/com/fastest/pass/home/presentation/ui/components/AddBankAccountFormScreen.kt

@@ -193,14 +193,14 @@ fun ColumnScope.NumberTextFieldAPS(
             )
             .background(color = colorResource(id = R.color.transparent)),
         shape = RoundedCornerShape(16.dp),
-        placeholder = {
-            Text(
-                text = placeholder,
-                style = MaterialTheme.typography.titleSmall.copy(
-                    color = colorResource(id = R.color.gray_text)
-                )
-            )
-        },
+//        placeholder = {
+//            Text(
+//                text = placeholder,
+//                style = MaterialTheme.typography.titleSmall.copy(
+//                    color = colorResource(id = R.color.gray_text)
+//                )
+//            )
+//        },
         label = {
             Text(text = stringResource(id = labelText),
                 style = MaterialTheme.typography.titleSmall.copy(
@@ -265,14 +265,14 @@ fun ColumnScope.TextNumberTextFieldAPS(
             )
             .background(color = colorResource(id = R.color.transparent)),
         shape = RoundedCornerShape(16.dp),
-        placeholder = {
-            Text(
-                text = placeholder,
-                style = MaterialTheme.typography.titleSmall.copy(
-                    color = colorResource(id = R.color.gray_text)
-                )
-            )
-        },
+//        placeholder = {
+//            Text(
+//                text = placeholder,
+//                style = MaterialTheme.typography.titleSmall.copy(
+//                    color = colorResource(id = R.color.gray_text)
+//                )
+//            )
+//        },
         label = {
             Text(text = stringResource(id = labelText),
                 style = MaterialTheme.typography.titleSmall.copy(

+ 4 - 4
app/src/main/java/com/fastest/pass/home/presentation/ui/components/AddContactInfoScreen.kt

@@ -140,8 +140,8 @@ fun AddContactInfoScreen() {
 
             Spacer(modifier = Modifier.height(20.dp))
             NameTextFieldACIFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.city_town)
-            Spacer(modifier = Modifier.height(20.dp))
-            NameTextFieldACIFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.country)
+//            Spacer(modifier = Modifier.height(20.dp))
+//            NameTextFieldACIFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.country)
             Spacer(modifier = Modifier.height(20.dp))
             NameTextFieldACIFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.state)
             Spacer(modifier = Modifier.height(20.dp))
@@ -368,7 +368,7 @@ fun ColumnScope.DatePickerACIFS(
             value = selectedDate,
             onValueChange = {},
             textStyle = MaterialTheme.typography.displayMedium.copy(
-                color = colorResource(id = R.color.gray_splash)
+                color = colorResource(id = R.color.gray_text)
             ),
             readOnly = true,
             label = { Text(
@@ -381,7 +381,7 @@ fun ColumnScope.DatePickerACIFS(
                 Icon(
                     imageVector = Icons.Default.DateRange,
                     contentDescription = "Calendar",
-                    tint = colorResource(id = R.color.gray_splash)
+                    tint = colorResource(id = R.color.gray_text)
                     )
             },
             modifier = Modifier

+ 190 - 12
app/src/main/java/com/fastest/pass/home/presentation/ui/components/AddDriverLicenseFormScreen.kt

@@ -26,7 +26,10 @@ import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.DatePicker
 import androidx.compose.material3.DatePickerDefaults
 import androidx.compose.material3.DatePickerDialog
+import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ExposedDropdownMenuBox
+import androidx.compose.material3.ExposedDropdownMenuDefaults
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
@@ -59,6 +62,7 @@ import com.fastest.pass.R
 fun AddDriverLicenseFormScreen() {
     val keyboardController = LocalSoftwareKeyboardController.current
     val focusManager = LocalFocusManager.current
+    val gender = listOf("Please Select", "Male", "Female", "Other")
 
     Box(
         modifier = Modifier
@@ -98,13 +102,18 @@ fun AddDriverLicenseFormScreen() {
             Spacer(modifier = Modifier.height(20.dp))
             NameTextFieldADLFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.zip_postal_code)
             Spacer(modifier = Modifier.height(20.dp))
-            NameTextFieldADLFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.country)
+            SelectCountryInfoDS(labelText = R.string.country, keyboardController = keyboardController, focusManager = focusManager)
+//            NameTextFieldADLFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.country)
 
             Spacer(modifier = Modifier.height(20.dp))
             DatePickerADLFS(labelText = R.string.date_of_birth) {}
 
             Spacer(modifier = Modifier.height(20.dp))
-            NameTextFieldADLFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.sex)
+            DropDownFieldADLFS(keyboardController = keyboardController, focusManager = focusManager,
+                labelText = R.string.gender, titles = gender)
+//            NameTextFieldADLFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.sex)
+
+
             Spacer(modifier = Modifier.height(20.dp))
             NameTextFieldADLFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.height)
 
@@ -240,14 +249,14 @@ fun ColumnScope.TextNumberTextFieldADLFS(
             )
             .background(color = colorResource(id = R.color.transparent)),
         shape = RoundedCornerShape(16.dp),
-        placeholder = {
-            Text(
-                text = placeholder,
-                style = MaterialTheme.typography.titleSmall.copy(
-                    color = colorResource(id = R.color.gray_text)
-                )
-            )
-        },
+//        placeholder = {
+//            Text(
+//                text = placeholder,
+//                style = MaterialTheme.typography.titleSmall.copy(
+//                    color = colorResource(id = R.color.gray_text)
+//                )
+//            )
+//        },
         label = {
             Text(text = stringResource(id = labelText),
                 style = MaterialTheme.typography.titleSmall.copy(
@@ -304,7 +313,7 @@ fun ColumnScope.DatePickerADLFS(
             value = selectedDate,
             onValueChange = {},
             textStyle = MaterialTheme.typography.displayMedium.copy(
-                color = colorResource(id = R.color.gray_splash)
+                color = colorResource(id = R.color.gray_text)
             ),
             readOnly = true,
             label = { Text(
@@ -317,7 +326,7 @@ fun ColumnScope.DatePickerADLFS(
                 Icon(
                     imageVector = Icons.Default.DateRange,
                     contentDescription = "Calendar",
-                    tint = colorResource(id = R.color.gray_splash)
+                    tint = colorResource(id = R.color.gray_text)
                 )
             },
             modifier = Modifier
@@ -459,4 +468,173 @@ fun ColumnScope.NotesTextFieldADLFS(
             }
         ),
     )
+}
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun ColumnScope.DropDownFieldADLFS(
+    keyboardController: SoftwareKeyboardController?,
+    focusManager: FocusManager,
+    labelText: Int,
+    titles: List<String>,
+    topPadding: Int = 0
+) {
+    var isExpanded by remember { mutableStateOf(false) }
+    var selectedText by remember { mutableStateOf(titles[0]) }
+
+    Column(
+        modifier = Modifier
+            .fillMaxWidth()
+            .background(color = colorResource(id = R.color.white)),
+    ) {
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(colorResource(id = R.color.white))
+        ) {
+            ExposedDropdownMenuBox(
+                expanded = isExpanded,
+                onExpandedChange = { isExpanded = !isExpanded },
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .defaultMinSize(60.dp)
+                    .wrapContentHeight()
+                    .border(
+                        1.dp,
+                        color = colorResource(id = R.color.gray_border_textfield),
+                        shape = RoundedCornerShape(16.dp)
+                    )
+                    .background(color = colorResource(id = R.color.white)),
+            ) {
+                TextField(
+                    value = selectedText,
+                    onValueChange = {},
+                    textStyle = MaterialTheme.typography.displayMedium.copy(
+                        color = if (selectedText == titles[0]) colorResource(id = R.color.gray_border_textfield)
+                        else colorResource(id = R.color.gray_splash)
+                    ),
+                    readOnly = true,
+                    label = { Text(
+                        stringResource(id = labelText),
+                        style = MaterialTheme.typography.titleSmall.copy(
+                            color = colorResource(id = R.color.gray_text)
+                        )
+                    ) },
+                    trailingIcon = { ExposedDropdownMenuDefaults.TrailingIcon(isExpanded) },
+                    modifier = Modifier
+                        .menuAnchor()
+                        .fillMaxWidth()
+                        .background(color = colorResource(id = R.color.white)),
+                    colors = ExposedDropdownMenuDefaults.textFieldColors(
+                        focusedLabelColor = colorResource(id = R.color.gray_splash),
+                        unfocusedContainerColor = colorResource(id = R.color.transparent),
+                        focusedContainerColor = colorResource(id = R.color.transparent),
+                        focusedIndicatorColor = colorResource(id = R.color.transparent),
+                        disabledIndicatorColor = colorResource(id = R.color.transparent),
+                        unfocusedIndicatorColor = colorResource(id = R.color.transparent),
+                        cursorColor = colorResource(id = R.color.gray_splash),
+                    ),
+                    keyboardOptions = KeyboardOptions(
+                        keyboardType = KeyboardType.Password
+                    )
+                )
+
+                ExposedDropdownMenu(
+                    expanded = isExpanded,
+                    onDismissRequest = { isExpanded = !isExpanded },
+                    modifier = Modifier
+                        .background(colorResource(id = R.color.white))
+                ) {
+                    titles.forEachIndexed { _, s ->
+                        DropdownMenuItem(
+                            text = {
+                                Text(
+                                    text = s,
+                                    style = MaterialTheme.typography.titleSmall.copy(
+                                        color = colorResource(id = R.color.gray_splash)
+                                    ),
+                                    modifier = Modifier
+                                        .padding(top = topPadding.dp)
+                                )
+                            },
+                            onClick = {
+                                selectedText = s
+                                isExpanded = false
+                            },
+                            modifier = Modifier
+                                .background(colorResource(id = R.color.white))
+                                .padding(top = 0.dp)
+                        )
+                    }
+                }
+            }
+        }
+    }
+}
+
+@Composable
+fun ColumnScope.SelectCountryInfoDS(
+    labelText: Int,
+    keyboardController: SoftwareKeyboardController?,
+    focusManager: FocusManager
+) {
+    var selectedCountry by remember { mutableStateOf("Please Select") }
+    var isSheetOpened by remember { mutableStateOf(false) }
+
+    TextField(
+        value = selectedCountry,
+        onValueChange = {},
+        textStyle = MaterialTheme.typography.displayMedium.copy(
+            color = if (selectedCountry == "Please Select") colorResource(id = R.color.gray_border_textfield)
+            else colorResource(id = R.color.gray_splash)
+        ),
+        readOnly = true,
+        label = {
+            Text(
+                stringResource(id = labelText),
+                style = MaterialTheme.typography.titleSmall.copy(
+                    color = colorResource(id = R.color.gray_text)
+                )
+            ) },
+        modifier = Modifier
+            .align(Alignment.Start)
+            .fillMaxWidth()
+            .defaultMinSize(minHeight = 60.dp)
+            .wrapContentHeight()
+            .border(
+                1.dp,
+                color = colorResource(id = R.color.gray_border_textfield),
+                shape = RoundedCornerShape(16.dp)
+            )
+            .background(color = colorResource(id = R.color.transparent))
+            .clickable {
+                isSheetOpened = true
+            },
+        shape = RoundedCornerShape(16.dp),
+        enabled = false,
+        colors = TextFieldDefaults.colors(
+            disabledContainerColor = colorResource(id = R.color.transparent),
+            focusedLabelColor = colorResource(id = R.color.gray_splash),
+            unfocusedContainerColor = colorResource(id = R.color.transparent),
+            focusedContainerColor = colorResource(id = R.color.transparent),
+            focusedIndicatorColor = colorResource(id = R.color.transparent),
+            disabledIndicatorColor = colorResource(id = R.color.transparent),
+            unfocusedIndicatorColor = colorResource(id = R.color.transparent),
+            cursorColor = colorResource(id = R.color.gray_splash),
+        ),
+        keyboardOptions = KeyboardOptions(
+            keyboardType = KeyboardType.Password
+        )
+    )
+
+    if (isSheetOpened) {
+        OpenModalBottomSheet(
+            keyboardController,
+            focusManager,
+            isSheetOpened = {isSheetOpened = false},
+            onSelectedCountry = { countryName ->
+                selectedCountry = countryName
+            }
+        )
+    }
 }

+ 194 - 12
app/src/main/java/com/fastest/pass/home/presentation/ui/components/AddPassportFormScreen.kt

@@ -26,7 +26,10 @@ import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.DatePicker
 import androidx.compose.material3.DatePickerDefaults
 import androidx.compose.material3.DatePickerDialog
+import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ExposedDropdownMenuBox
+import androidx.compose.material3.ExposedDropdownMenuDefaults
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
@@ -59,6 +62,7 @@ import com.fastest.pass.R
 fun AddPassportFormScreen() {
     val keyboardController = LocalSoftwareKeyboardController.current
     val focusManager = LocalFocusManager.current
+    val gender = listOf("Please Select", "Male", "Female", "Other")
 
     Box(
         modifier = Modifier
@@ -85,12 +89,21 @@ fun AddPassportFormScreen() {
             Spacer(modifier = Modifier.height(20.dp))
             NameTextFieldAPFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.name)
             Spacer(modifier = Modifier.height(20.dp))
-            NameTextFieldAPFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.country)
+            SelectCountryInfoPassport(labelText = R.string.country, keyboardController = keyboardController, focusManager = focusManager)
+//            NameTextFieldAPFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.country)
+
             Spacer(modifier = Modifier.height(20.dp))
             TextNumberTextFieldAPFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.number, placeholder = "P12345678")
 
             Spacer(modifier = Modifier.height(20.dp))
-            NameTextFieldAPFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.sex)
+            DropDownFieldPassport(
+                keyboardController = keyboardController,
+                focusManager = focusManager,
+                labelText = R.string.gender,
+                titles = gender
+            )
+//            NameTextFieldAPFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.sex)
+
             Spacer(modifier = Modifier.height(20.dp))
             NameTextFieldAPFS(keyboardController = keyboardController, focusManager = focusManager, labelText = R.string.nationality)
             Spacer(modifier = Modifier.height(20.dp))
@@ -236,14 +249,14 @@ fun ColumnScope.TextNumberTextFieldAPFS(
             )
             .background(color = colorResource(id = R.color.transparent)),
         shape = RoundedCornerShape(16.dp),
-        placeholder = {
-            Text(
-                text = placeholder,
-                style = MaterialTheme.typography.titleSmall.copy(
-                    color = colorResource(id = R.color.gray_text)
-                )
-            )
-        },
+//        placeholder = {
+//            Text(
+//                text = placeholder,
+//                style = MaterialTheme.typography.titleSmall.copy(
+//                    color = colorResource(id = R.color.gray_text)
+//                )
+//            )
+//        },
         label = {
             Text(text = stringResource(id = labelText),
                 style = MaterialTheme.typography.titleSmall.copy(
@@ -300,7 +313,7 @@ fun ColumnScope.DatePickerAPFS(
             value = selectedDate,
             onValueChange = {},
             textStyle = MaterialTheme.typography.displayMedium.copy(
-                color = colorResource(id = R.color.gray_splash)
+                color = colorResource(id = R.color.gray_text)
             ),
             readOnly = true,
             label = { Text(
@@ -313,7 +326,7 @@ fun ColumnScope.DatePickerAPFS(
                 Icon(
                     imageVector = Icons.Default.DateRange,
                     contentDescription = "Calendar",
-                    tint = colorResource(id = R.color.gray_splash)
+                    tint = colorResource(id = R.color.gray_text)
                 )
             },
             modifier = Modifier
@@ -455,4 +468,173 @@ fun ColumnScope.NotesTextFieldAPFS(
             }
         ),
     )
+}
+
+@Composable
+fun ColumnScope.SelectCountryInfoPassport(
+    labelText: Int,
+    keyboardController: SoftwareKeyboardController?,
+    focusManager: FocusManager
+) {
+    var selectedCountry by remember { mutableStateOf("Please Select") }
+    var isSheetOpened by remember { mutableStateOf(false) }
+
+    TextField(
+        value = selectedCountry,
+        onValueChange = {},
+        textStyle = MaterialTheme.typography.displayMedium.copy(
+            color = if (selectedCountry == "Please Select") colorResource(id = R.color.gray_border_textfield)
+            else colorResource(id = R.color.gray_splash)
+        ),
+        readOnly = true,
+        label = {
+            Text(
+                stringResource(id = labelText),
+                style = MaterialTheme.typography.titleSmall.copy(
+                    color = colorResource(id = R.color.gray_text)
+                )
+            ) },
+        modifier = Modifier
+            .align(Alignment.Start)
+            .fillMaxWidth()
+            .defaultMinSize(minHeight = 60.dp)
+            .wrapContentHeight()
+            .border(
+                1.dp,
+                color = colorResource(id = R.color.gray_border_textfield),
+                shape = RoundedCornerShape(16.dp)
+            )
+            .background(color = colorResource(id = R.color.transparent))
+            .clickable {
+                isSheetOpened = true
+            },
+        shape = RoundedCornerShape(16.dp),
+        enabled = false,
+        colors = TextFieldDefaults.colors(
+            disabledContainerColor = colorResource(id = R.color.transparent),
+            focusedLabelColor = colorResource(id = R.color.gray_splash),
+            unfocusedContainerColor = colorResource(id = R.color.transparent),
+            focusedContainerColor = colorResource(id = R.color.transparent),
+            focusedIndicatorColor = colorResource(id = R.color.transparent),
+            disabledIndicatorColor = colorResource(id = R.color.transparent),
+            unfocusedIndicatorColor = colorResource(id = R.color.transparent),
+            cursorColor = colorResource(id = R.color.gray_splash),
+        ),
+        keyboardOptions = KeyboardOptions(
+            keyboardType = KeyboardType.Password
+        )
+    )
+
+    if (isSheetOpened) {
+        OpenModalBottomSheet(
+            keyboardController,
+            focusManager,
+            isSheetOpened = {isSheetOpened = false},
+            onSelectedCountry = { countryName ->
+                selectedCountry = countryName
+            }
+        )
+    }
+}
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun ColumnScope.DropDownFieldPassport(
+    keyboardController: SoftwareKeyboardController?,
+    focusManager: FocusManager,
+    labelText: Int,
+    titles: List<String>,
+    topPadding: Int = 0
+) {
+    var isExpanded by remember { mutableStateOf(false) }
+    var selectedText by remember { mutableStateOf(titles[0]) }
+
+    Column(
+        modifier = Modifier
+            .fillMaxWidth()
+            .background(color = colorResource(id = R.color.white)),
+    ) {
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(colorResource(id = R.color.white))
+        ) {
+            ExposedDropdownMenuBox(
+                expanded = isExpanded,
+                onExpandedChange = { isExpanded = !isExpanded },
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .defaultMinSize(60.dp)
+                    .wrapContentHeight()
+                    .border(
+                        1.dp,
+                        color = colorResource(id = R.color.gray_border_textfield),
+                        shape = RoundedCornerShape(16.dp)
+                    )
+                    .background(color = colorResource(id = R.color.white)),
+            ) {
+                TextField(
+                    value = selectedText,
+                    onValueChange = {},
+                    textStyle = MaterialTheme.typography.displayMedium.copy(
+                        color = if (selectedText == titles[0]) colorResource(id = R.color.gray_border_textfield)
+                        else colorResource(id = R.color.gray_splash)
+                    ),
+                    readOnly = true,
+                    label = { Text(
+                        stringResource(id = labelText),
+                        style = MaterialTheme.typography.titleSmall.copy(
+                            color = colorResource(id = R.color.gray_text)
+                        )
+                    ) },
+                    trailingIcon = { ExposedDropdownMenuDefaults.TrailingIcon(isExpanded) },
+                    modifier = Modifier
+                        .menuAnchor()
+                        .fillMaxWidth()
+                        .background(color = colorResource(id = R.color.white)),
+                    colors = ExposedDropdownMenuDefaults.textFieldColors(
+                        focusedLabelColor = colorResource(id = R.color.gray_splash),
+                        unfocusedContainerColor = colorResource(id = R.color.transparent),
+                        focusedContainerColor = colorResource(id = R.color.transparent),
+                        focusedIndicatorColor = colorResource(id = R.color.transparent),
+                        disabledIndicatorColor = colorResource(id = R.color.transparent),
+                        unfocusedIndicatorColor = colorResource(id = R.color.transparent),
+                        cursorColor = colorResource(id = R.color.gray_splash),
+                    ),
+                    keyboardOptions = KeyboardOptions(
+                        keyboardType = KeyboardType.Password
+                    )
+                )
+
+                ExposedDropdownMenu(
+                    expanded = isExpanded,
+                    onDismissRequest = { isExpanded = !isExpanded },
+                    modifier = Modifier
+                        .background(colorResource(id = R.color.white))
+                ) {
+                    titles.forEachIndexed { _, s ->
+                        DropdownMenuItem(
+                            text = {
+                                Text(
+                                    text = s,
+                                    style = MaterialTheme.typography.titleSmall.copy(
+                                        color = colorResource(id = R.color.gray_splash)
+                                    ),
+                                    modifier = Modifier
+                                        .padding(top = topPadding.dp)
+                                )
+                            },
+                            onClick = {
+                                selectedText = s
+                                isExpanded = false
+                            },
+                            modifier = Modifier
+                                .background(colorResource(id = R.color.white))
+                                .padding(top = 0.dp)
+                        )
+                    }
+                }
+            }
+        }
+    }
 }

+ 2 - 0
app/src/main/java/com/fastest/pass/home/presentation/ui/components/AddPasswordFormScreen.kt

@@ -4,6 +4,7 @@ import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.detectTapGestures
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.BoxScope
 import androidx.compose.foundation.layout.Column
@@ -42,6 +43,7 @@ import androidx.compose.ui.draw.scale
 import androidx.compose.ui.focus.FocusManager
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.platform.LocalSoftwareKeyboardController
 import androidx.compose.ui.platform.SoftwareKeyboardController

+ 8 - 8
app/src/main/java/com/fastest/pass/home/presentation/ui/components/AddPaymentCardFormScreen.kt

@@ -189,14 +189,14 @@ fun ColumnScope.NumberTextFieldAPCFS(
             )
             .background(color = colorResource(id = R.color.transparent)),
         shape = RoundedCornerShape(16.dp),
-        placeholder = {
-            Text(
-                text = placeholder,
-                style = MaterialTheme.typography.titleSmall.copy(
-                    color = colorResource(id = R.color.gray_text)
-                )
-            )
-        },
+//        placeholder = {
+//            Text(
+//                text = placeholder,
+//                style = MaterialTheme.typography.titleSmall.copy(
+//                    color = colorResource(id = R.color.gray_text)
+//                )
+//            )
+//        },
         label = {
             Text(text = stringResource(id = labelText),
                 style = MaterialTheme.typography.titleSmall.copy(

+ 13 - 0
app/src/main/java/com/fastest/pass/home/presentation/ui/components/NewItemFormScreen.kt

@@ -2,6 +2,7 @@ package com.fastest.pass.home.presentation.ui.components
 
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.gestures.detectTapGestures
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
@@ -22,6 +23,9 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.input.pointer.pointerInput
+import androidx.compose.ui.platform.LocalFocusManager
+import androidx.compose.ui.platform.LocalSoftwareKeyboardController
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
@@ -35,6 +39,9 @@ enum class ClickTypeNewItemForm {
 
 @Composable
 fun NewItemFormScreen(screenName: String, screenNameType: ClickTypeAddNewItem, clickType: (ClickTypeNewItemForm) -> Unit) {
+    val keyboardController = LocalSoftwareKeyboardController.current
+    val focusManager = LocalFocusManager.current
+
     Column(
         modifier = Modifier
             .fillMaxSize()
@@ -42,6 +49,12 @@ fun NewItemFormScreen(screenName: String, screenNameType: ClickTypeAddNewItem, c
             .statusBarsPadding()
             .background(colorResource(id = R.color.white))
             .navigationBarsPadding()
+            .pointerInput(Unit) {
+                detectTapGestures {
+                    focusManager.clearFocus()
+                    keyboardController?.hide()
+                }
+            }
     ) {
         Row(
             modifier = Modifier