Skip to content

Commit abe76af

Browse files
committed
TextField Changes
1 parent d5574e1 commit abe76af

File tree

6 files changed

+65
-26
lines changed

6 files changed

+65
-26
lines changed

app/src/main/java/com/togitech/togii/MainActivity.kt

Lines changed: 27 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,18 @@ import androidx.compose.foundation.layout.fillMaxSize
99
import androidx.compose.foundation.rememberScrollState
1010
import androidx.compose.foundation.verticalScroll
1111
import androidx.compose.material.*
12-
import androidx.compose.runtime.*
12+
import androidx.compose.runtime.Composable
13+
import androidx.compose.runtime.getValue
14+
import androidx.compose.runtime.mutableStateOf
1315
import androidx.compose.runtime.saveable.rememberSaveable
16+
import androidx.compose.runtime.setValue
1417
import androidx.compose.ui.Alignment
1518
import androidx.compose.ui.Modifier
1619
import androidx.compose.ui.graphics.Color
1720
import com.google.accompanist.systemuicontroller.rememberSystemUiController
1821
import com.togitech.ccp.component.TogiCountryCodePicker
1922
import com.togitech.ccp.data.utils.getDefaultCountry
23+
import com.togitech.ccp.data.utils.getDefaultCountryCode
2024
import com.togitech.ccp.data.utils.getLibCountries
2125
import com.togitech.togii.ui.theme.TogiiTheme
2226

@@ -64,27 +68,42 @@ class MainActivity : ComponentActivity() {
6468

6569
@Composable
6670
fun SelectCountryWithCountryCode() {
67-
var selectedItem by rememberSaveable { mutableStateOf(getDefaultCountry(this)) }
71+
var selectedCountry by rememberSaveable { mutableStateOf(getDefaultCountryCode(this)) }
72+
val phoneNumber = rememberSaveable { mutableStateOf("") }
73+
var defaultCountry by rememberSaveable { mutableStateOf(getDefaultCountry(this))}
74+
6875
TogiCountryCodePicker(
6976
pickedCountry = {
70-
selectedItem = it.countryCode
77+
selectedCountry = it.countryPhoneCode
78+
defaultCountry = it.countryCode
79+
7180
},
72-
defaultCountry = getLibCountries().single { it.countryCode == selectedItem },
81+
defaultCountry = getLibCountries().single { it.countryCode == defaultCountry },
7382
dialogAppBarTextColor = Color.Black,
74-
dialogAppBarColor = Color.White
83+
dialogAppBarColor = Color.White,
84+
text = phoneNumber.value,
85+
onValueChange = { phoneNumber.value = it }
7586
)
87+
7688
}
7789

7890
@Composable
7991
fun SelectCountryWithoutCountryCode() {
80-
var selectedItem by rememberSaveable { mutableStateOf(getDefaultCountry(this)) }
92+
var selectedCountry by rememberSaveable { mutableStateOf(getDefaultCountryCode(this)) }
93+
val phoneNumber = rememberSaveable { mutableStateOf("") }
94+
var defaultCountry by rememberSaveable { mutableStateOf(getDefaultCountry(this))}
95+
8196
TogiCountryCodePicker(
8297
pickedCountry = {
83-
selectedItem = it.countryCode
98+
selectedCountry = it.countryPhoneCode
99+
defaultCountry = it.countryCode
84100
},
85-
defaultCountry = getLibCountries().single { it.countryCode == selectedItem },
101+
defaultCountry = getLibCountries().single { it.countryCode == defaultCountry},
86102
showCountryCode = false,
103+
text = phoneNumber.value,
104+
onValueChange = { phoneNumber.value = it }
87105
)
88106

107+
Text(text = "Number with * : $selectedCountry${phoneNumber.value}")
89108
}
90109
}

ccp/src/main/java/com/togitech/ccp/component/TogiCodePicker.kt

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
package com.togitech.ccp.component
22

3+
import android.annotation.SuppressLint
34
import androidx.compose.foundation.Image
45
import androidx.compose.foundation.background
56
import androidx.compose.foundation.clickable
@@ -144,7 +145,6 @@ class TogiCodePicker {
144145
cursorColor = cursorColorSearch,
145146
)
146147
}
147-
148148
LazyColumn {
149149
items(
150150
(if (searchValue.isEmpty()) {
@@ -192,6 +192,7 @@ class TogiCodePicker {
192192
}
193193

194194

195+
@SuppressLint("ComposableNaming")
195196
@Composable
196197
private fun DialogSearchView(
197198
focusedBorderColor: Color = MaterialTheme.colors.primary,

ccp/src/main/java/com/togitech/ccp/component/TogiCountryCodePicker.kt

Lines changed: 25 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,34 @@
11
package com.togitech.ccp.component
22

3-
import android.widget.Toast
43
import androidx.compose.foundation.layout.*
4+
import androidx.compose.foundation.text.KeyboardActions
55
import androidx.compose.foundation.text.KeyboardOptions
66
import androidx.compose.material.*
77
import androidx.compose.runtime.*
8-
import androidx.compose.runtime.saveable.rememberSaveable
98
import androidx.compose.ui.Alignment
9+
import androidx.compose.ui.ExperimentalComposeUiApi
1010
import androidx.compose.ui.Modifier
1111
import androidx.compose.ui.graphics.Color
1212
import androidx.compose.ui.graphics.Shape
13-
import androidx.compose.ui.platform.LocalContext
13+
import androidx.compose.ui.platform.LocalSoftwareKeyboardController
1414
import androidx.compose.ui.res.stringResource
1515
import androidx.compose.ui.text.input.KeyboardType
1616
import androidx.compose.ui.text.input.TextFieldValue
17-
import androidx.compose.ui.tooling.preview.Preview
1817
import androidx.compose.ui.unit.dp
1918
import com.togitech.ccp.data.CountryData
20-
import com.togitech.ccp.data.utils.getLibCountries
2119
import com.togitech.ccp.data.utils.getNumberHint
2220
import com.togitech.ccp.transformation.PhoneNumberTransformation
2321

22+
@OptIn(ExperimentalComposeUiApi::class)
2423
@Composable
2524
fun TogiCountryCodePicker(
25+
text: String,
26+
onValueChange: (String) -> Unit,
2627
modifier: Modifier = Modifier,
2728
shape: Shape = MaterialTheme.shapes.small,
2829
color: Color = MaterialTheme.colors.background,
2930
showCountryCode: Boolean = true,
30-
defaultCountry: CountryData = getLibCountries().first(),
31+
defaultCountry: CountryData,
3132
pickedCountry: (CountryData) -> Unit,
3233
focusedBorderColor: Color = MaterialTheme.colors.primary,
3334
unfocusedBorderColor: Color = MaterialTheme.colors.onSecondary,
@@ -37,10 +38,12 @@ fun TogiCountryCodePicker(
3738
cursorColorSearch: Color = MaterialTheme.colors.primary,
3839
dialogAppBarColor: Color = MaterialTheme.colors.primary,
3940
dialogAppBarTextColor: Color = Color.White,
41+
4042
rowPadding: Modifier = modifier.padding(start = 12.dp, end = 16.dp, top = 12.dp, bottom = 12.dp)
4143
) {
42-
var phoneNumber by rememberSaveable { mutableStateOf("") }
43-
44+
var textFieldValueState by remember { mutableStateOf(TextFieldValue(text = text)) }
45+
val textFieldValue = textFieldValueState.copy(text = text)
46+
val keyboardController = LocalSoftwareKeyboardController.current
4447
Surface(
4548
shape = shape,
4649
color = color
@@ -52,24 +55,32 @@ fun TogiCountryCodePicker(
5255
)
5356
{
5457
OutlinedTextField(
55-
modifier = modifier.fillMaxWidth(),
58+
modifier = modifier
59+
.fillMaxWidth(),
5660

57-
value = phoneNumber,
61+
value = textFieldValue,
5862
colors = TextFieldDefaults.outlinedTextFieldColors(
5963
focusedBorderColor = focusedBorderColor,
6064
unfocusedBorderColor = unfocusedBorderColor,
6165
cursorColor = cursorColor
6266
),
63-
onValueChange = { newPhone ->
64-
phoneNumber = newPhone
67+
onValueChange = {
68+
textFieldValueState = it
69+
if (text != it.text) {
70+
onValueChange(it.text)
71+
}
6572
},
6673
singleLine = true,
6774
visualTransformation = PhoneNumberTransformation(defaultCountry.countryCode.uppercase()),
6875
placeholder = { Text(text = stringResource(id = getNumberHint(defaultCountry.countryCode))) },
69-
keyboardOptions = KeyboardOptions.Default.copy(keyboardType = KeyboardType.NumberPassword),
76+
keyboardOptions = KeyboardOptions.Default.copy(
77+
keyboardType = KeyboardType.NumberPassword,
78+
autoCorrect = true,
79+
),
80+
keyboardActions = KeyboardActions(onDone = { keyboardController?.hide() }),
7081
leadingIcon = {
7182
Row {
72-
Column() {
83+
Column {
7384
val dialog = TogiCodePicker()
7485
dialog.TogiCodeDialog(
7586
pickedCountry = pickedCountry,

ccp/src/main/java/com/togitech/ccp/data/utils/TogiUtils.kt

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,23 @@ import android.content.Context
44
import android.telephony.TelephonyManager
55
import android.util.Log
66
import androidx.compose.ui.text.intl.Locale
7+
import com.togitech.ccp.data.CountryData
78

89
fun getDefaultCountry(context: Context): String {
10+
911
val localeCode: TelephonyManager =
1012
context.getSystemService(Context.TELEPHONY_SERVICE) as TelephonyManager
1113
val countryCode = localeCode.networkCountryIso
1214
val defaultLocale = Locale.current.language
1315

1416
Log.d("Country Code:", countryCode)
1517
return countryCode.ifEmpty { defaultLocale }
16-
}
18+
}
19+
20+
21+
fun getDefaultCountryCode(context: Context): String {
22+
val defaultCountry = getDefaultCountry(context)
23+
val defaultCode: CountryData = getLibCountries().first() { it.countryCode == defaultCountry }
24+
return defaultCode.countryPhoneCode
25+
}
26+

ccp/src/main/java/com/togitech/ccp/transformation/PhoneNumberTransformation.kt

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,7 @@ import androidx.compose.ui.text.AnnotatedString
66
import androidx.compose.ui.text.input.OffsetMapping
77
import androidx.compose.ui.text.input.TransformedText
88
import androidx.compose.ui.text.input.VisualTransformation
9-
import androidx.core.text.isDigitsOnly
109
import com.google.i18n.phonenumbers.PhoneNumberUtil
11-
import java.lang.Exception
1210
import java.util.*
1311

1412
class PhoneNumberTransformation(countryCode: String = Locale.getDefault().country) :

screenshots/shot.gif

-4.56 MB
Loading

0 commit comments

Comments
 (0)