Skip to content

Commit 472b12c

Browse files
togisofttogisoft
committed
* Rounded phone field added
* Codes optimized * Added Italian language
1 parent 88ccb5a commit 472b12c

File tree

6 files changed

+502
-341
lines changed

6 files changed

+502
-341
lines changed

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

Lines changed: 56 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,10 @@ import androidx.compose.runtime.saveable.rememberSaveable
1212
import androidx.compose.ui.Alignment
1313
import androidx.compose.ui.Modifier
1414
import androidx.compose.ui.graphics.Color
15-
import androidx.compose.ui.text.font.FontWeight
1615
import androidx.compose.ui.unit.dp
1716
import com.google.accompanist.systemuicontroller.rememberSystemUiController
1817
import com.togitech.ccp.component.TogiCountryCodePicker
18+
import com.togitech.ccp.component.TogiRoundedPicker
1919
import com.togitech.ccp.data.utils.checkPhoneNumber
2020
import com.togitech.ccp.data.utils.getDefaultLangCode
2121
import com.togitech.ccp.data.utils.getDefaultPhoneCode
@@ -58,6 +58,8 @@ class MainActivity : ComponentActivity() {
5858
) {
5959

6060
SelectCountryWithCountryCode()
61+
RoundedPicker()
62+
6163
}
6264
}
6365

@@ -73,13 +75,7 @@ class MainActivity : ComponentActivity() {
7375
Column(
7476
modifier = Modifier.padding(16.dp)
7577
) {
76-
Text(
77-
text = verifyText,
78-
fontWeight = FontWeight.Bold,
79-
modifier = Modifier
80-
.fillMaxWidth()
81-
.wrapContentSize(Alignment.Center)
82-
)
78+
8379
TogiCountryCodePicker(
8480
pickedCountry = {
8581
phoneCode = it.countryPhoneCode
@@ -101,23 +97,63 @@ class MainActivity : ComponentActivity() {
10197
fullPhoneNumber = fullPhoneNumber,
10298
countryCode = defaultLang
10399
)
104-
Button(
100+
OutlinedButton(
105101
onClick = {
106-
verifyText = if (checkPhoneNumber) {
107-
isValidPhone = true
108-
"Phone Number Correct"
109-
} else {
110-
isValidPhone = false
111-
"Phone Number is Wrong"
112-
113-
}
102+
isValidPhone = checkPhoneNumber
114103
},
115-
modifier = Modifier.fillMaxWidth()
116-
.padding(16.dp)
117-
.height(60.dp)
104+
modifier = Modifier
105+
.fillMaxWidth()
106+
.padding(horizontal = 16.dp)
107+
.height(
108+
50.dp
109+
)
118110
) {
119111
Text(text = "Phone Verify")
120112
}
121113
}
122114
}
123115
}
116+
117+
118+
@Composable
119+
private fun RoundedPicker() {
120+
Column(
121+
modifier = Modifier.padding(16.dp)
122+
) {
123+
val getDefaultLangCode = getDefaultLangCode()
124+
val getDefaultPhoneCode = getDefaultPhoneCode()
125+
var phoneCode by rememberSaveable { mutableStateOf(getDefaultPhoneCode) }
126+
val phoneNumber = rememberSaveable { mutableStateOf("") }
127+
var defaultLang by rememberSaveable { mutableStateOf(getDefaultLangCode) }
128+
var isValidPhone by remember { mutableStateOf(true) }
129+
val fullPhoneNumber = "$phoneCode${phoneNumber.value}"
130+
131+
val checkPhoneNumber = checkPhoneNumber(
132+
phone = phoneNumber.value,
133+
fullPhoneNumber = fullPhoneNumber,
134+
countryCode = defaultLang
135+
)
136+
137+
TogiRoundedPicker(
138+
value = phoneNumber.value,
139+
onValueChange = { phoneNumber.value = it },
140+
defaultCountry = getLibCountries().single { it.countryCode == defaultLang },
141+
pickedCountry = {
142+
phoneCode = it.countryPhoneCode
143+
defaultLang = it.countryCode
144+
},
145+
error = isValidPhone
146+
)
147+
148+
OutlinedButton(
149+
onClick = { isValidPhone = checkPhoneNumber }, modifier = Modifier
150+
.fillMaxWidth()
151+
.padding(horizontal = 16.dp)
152+
.height(
153+
50.dp
154+
)
155+
) {
156+
Text(text = "Verify Phone Number")
157+
}
158+
}
159+
}

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

Lines changed: 116 additions & 113 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ package com.togitech.ccp.component
33
import androidx.compose.foundation.Image
44
import androidx.compose.foundation.background
55
import androidx.compose.foundation.clickable
6+
import androidx.compose.foundation.interaction.MutableInteractionSource
67
import androidx.compose.foundation.layout.*
78
import androidx.compose.foundation.lazy.LazyColumn
89
import androidx.compose.foundation.lazy.items
@@ -56,129 +57,132 @@ class TogiCodePicker {
5657
var searchValue by remember { mutableStateOf("") }
5758
var isSearch by remember { mutableStateOf(false) }
5859
val context = LocalContext.current
60+
val interactionSource = remember { MutableInteractionSource() }
5961

60-
Card(
61-
modifier = modifier
62-
.padding(2.dp)
63-
.clickable { isOpenDialog = true }
62+
Column(
63+
modifier = Modifier
64+
.padding(padding)
65+
.clickable(
66+
interactionSource = interactionSource,
67+
indication = null
68+
) { isOpenDialog = true },
6469
) {
65-
Column(modifier = Modifier.padding(padding)) {
66-
Row(
67-
horizontalArrangement = Arrangement.SpaceBetween,
68-
verticalAlignment = Alignment.CenterVertically
69-
) {
70-
Image(
71-
modifier = modifier.width(34.dp),
72-
painter = painterResource(
73-
id = getFlags(
74-
isPickCountry.countryCode
75-
)
76-
), contentDescription = null
77-
)
78-
if (showCountryCode) {
79-
Text(
80-
text = isPickCountry.countryPhoneCode,
81-
fontWeight = FontWeight.Bold,
82-
modifier = Modifier.padding(start = 6.dp)
70+
Row(
71+
horizontalArrangement = Arrangement.SpaceBetween,
72+
verticalAlignment = Alignment.CenterVertically
73+
) {
74+
Image(
75+
modifier = modifier.width(34.dp),
76+
painter = painterResource(
77+
id = getFlags(
78+
isPickCountry.countryCode
8379
)
84-
Icon(imageVector = Icons.Default.ArrowDropDown, contentDescription = null)
85-
}
80+
), contentDescription = null
81+
)
82+
if (showCountryCode) {
83+
Text(
84+
text = isPickCountry.countryPhoneCode,
85+
fontWeight = FontWeight.Bold,
86+
modifier = Modifier.padding(start = 6.dp)
87+
)
88+
Icon(imageVector = Icons.Default.ArrowDropDown, contentDescription = null)
8689
}
8790
}
91+
}
8892

89-
//Select Country Dialog
90-
if (isOpenDialog) {
91-
Dialog(
92-
onDismissRequest = { isOpenDialog = false },
93-
properties = DialogProperties(
94-
usePlatformDefaultWidth = false),
93+
//Select Country Dialog
94+
if (isOpenDialog) {
95+
Dialog(
96+
onDismissRequest = { isOpenDialog = false },
97+
properties = DialogProperties(
98+
usePlatformDefaultWidth = false
99+
),
100+
) {
101+
Scaffold(
102+
topBar = {
103+
TopAppBar(
104+
title = {
105+
Text(
106+
text = stringResource(id = R.string.select_country),
107+
textAlign = TextAlign.Center,
108+
modifier = modifier.fillMaxWidth()
109+
)
110+
},
111+
navigationIcon = {
112+
IconButton(onClick = {
113+
isOpenDialog = false
114+
isSearch = false
115+
}) {
116+
Icon(
117+
imageVector = Icons.Rounded.ArrowBack,
118+
contentDescription = "Back"
119+
)
120+
}
121+
},
122+
backgroundColor = dialogAppBarColor,
123+
contentColor = dialogAppBarTextColor,
124+
actions = {
125+
IconButton(onClick = {
126+
isSearch = !isSearch
127+
}) {
128+
Icon(
129+
imageVector = Icons.Rounded.Search,
130+
contentDescription = "Search"
131+
)
132+
}
133+
}
134+
)
135+
}
95136
) {
96-
Scaffold(
97-
topBar = {
98-
TopAppBar(
99-
title = {
100-
Text(
101-
text = stringResource(id = R.string.select_country),
102-
textAlign = TextAlign.Center,
103-
modifier = modifier.fillMaxWidth()
137+
Surface(modifier = modifier.fillMaxSize()) {
138+
Card(
139+
Modifier
140+
.fillMaxWidth()
141+
.fillMaxHeight(),
142+
elevation = 4.dp,
143+
) {
144+
Column {
145+
if (isSearch) {
146+
searchValue = dialogSearchView(
147+
focusedBorderColor = focusedBorderColorSearch,
148+
unfocusedBorderColor = unfocusedBorderColorSearch,
149+
cursorColor = cursorColorSearch,
104150
)
105-
},
106-
navigationIcon = {
107-
IconButton(onClick = {
108-
isOpenDialog = false
109-
isSearch = false
110-
}) {
111-
Icon(
112-
imageVector = Icons.Rounded.ArrowBack,
113-
contentDescription = "Back"
114-
)
115-
}
116-
},
117-
backgroundColor = dialogAppBarColor,
118-
contentColor = dialogAppBarTextColor,
119-
actions = {
120-
IconButton(onClick = {
121-
isSearch = !isSearch
122-
}) {
123-
Icon(
124-
imageVector = Icons.Rounded.Search,
125-
contentDescription = "Search"
126-
)
127-
}
128151
}
129-
)
130-
}
131-
) {
132-
Surface(modifier = modifier.fillMaxSize()) {
133-
Card(
134-
Modifier
135-
.fillMaxWidth()
136-
.fillMaxHeight(),
137-
elevation = 4.dp,
138-
) {
139-
Column {
140-
if (isSearch) {
141-
searchValue = dialogSearchView(
142-
focusedBorderColor = focusedBorderColorSearch,
143-
unfocusedBorderColor = unfocusedBorderColorSearch,
144-
cursorColor = cursorColorSearch,
145-
)
146-
}
147-
LazyColumn {
148-
items(
149-
(if (searchValue.isEmpty()) {
150-
countryList
151-
} else {
152-
countryList.searchCountry(
153-
searchValue,
154-
context = context
152+
LazyColumn {
153+
items(
154+
(if (searchValue.isEmpty()) {
155+
countryList
156+
} else {
157+
countryList.searchCountry(
158+
searchValue,
159+
context = context
160+
)
161+
})
162+
) { countryItem ->
163+
Row(
164+
Modifier
165+
.padding(
166+
horizontal = 18.dp,
167+
vertical = 18.dp
155168
)
156-
})
157-
) { countryItem ->
158-
Row(
159-
Modifier
160-
.padding(
161-
horizontal = 18.dp,
162-
vertical = 18.dp
169+
.clickable {
170+
pickedCountry(countryItem)
171+
isPickCountry = countryItem
172+
isOpenDialog = false
173+
}) {
174+
Image(
175+
modifier = modifier.width(30.dp),
176+
painter = painterResource(
177+
id = getFlags(
178+
countryItem.countryCode
163179
)
164-
.clickable {
165-
pickedCountry(countryItem)
166-
isPickCountry = countryItem
167-
isOpenDialog = false
168-
}) {
169-
Image(
170-
modifier = modifier.width(30.dp),
171-
painter = painterResource(
172-
id = getFlags(
173-
countryItem.countryCode
174-
)
175-
), contentDescription = null
176-
)
177-
Text(
178-
stringResource(id = getCountryName(countryItem.countryCode.lowercase())),
179-
Modifier.padding(horizontal = 18.dp)
180-
)
181-
}
180+
), contentDescription = null
181+
)
182+
Text(
183+
stringResource(id = getCountryName(countryItem.countryCode.lowercase())),
184+
Modifier.padding(horizontal = 18.dp)
185+
)
182186
}
183187
}
184188
}
@@ -190,7 +194,6 @@ class TogiCodePicker {
190194
}
191195
}
192196

193-
194197
@Composable
195198
private fun dialogSearchView(
196199
focusedBorderColor: Color = MaterialTheme.colors.primary,

0 commit comments

Comments
 (0)