Skip to content

Commit 6155134

Browse files
togisofttogisoft
committed
* Number verification added
* Code edits made * Bugs fixed
1 parent 9d1ae60 commit 6155134

File tree

9 files changed

+535
-247
lines changed

9 files changed

+535
-247
lines changed

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

Lines changed: 60 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -3,24 +3,22 @@ package com.togitech.togii
33
import android.os.Bundle
44
import androidx.activity.ComponentActivity
55
import androidx.activity.compose.setContent
6-
import androidx.compose.foundation.layout.Arrangement
7-
import androidx.compose.foundation.layout.Column
8-
import androidx.compose.foundation.layout.fillMaxSize
6+
import androidx.compose.foundation.layout.*
97
import androidx.compose.foundation.rememberScrollState
108
import androidx.compose.foundation.verticalScroll
119
import androidx.compose.material.*
12-
import androidx.compose.runtime.Composable
13-
import androidx.compose.runtime.getValue
14-
import androidx.compose.runtime.mutableStateOf
10+
import androidx.compose.runtime.*
1511
import androidx.compose.runtime.saveable.rememberSaveable
16-
import androidx.compose.runtime.setValue
1712
import androidx.compose.ui.Alignment
1813
import androidx.compose.ui.Modifier
1914
import androidx.compose.ui.graphics.Color
15+
import androidx.compose.ui.text.font.FontWeight
16+
import androidx.compose.ui.unit.dp
2017
import com.google.accompanist.systemuicontroller.rememberSystemUiController
2118
import com.togitech.ccp.component.TogiCountryCodePicker
22-
import com.togitech.ccp.data.utils.getDefaultCountry
23-
import com.togitech.ccp.data.utils.getDefaultCountryCode
19+
import com.togitech.ccp.data.utils.checkPhoneNumber
20+
import com.togitech.ccp.data.utils.getDefaultLangCode
21+
import com.togitech.ccp.data.utils.getDefaultPhoneCode
2422
import com.togitech.ccp.data.utils.getLibCountries
2523
import com.togitech.togii.ui.theme.TogiiTheme
2624

@@ -59,51 +57,67 @@ class MainActivity : ComponentActivity() {
5957
horizontalAlignment = Alignment.CenterHorizontally
6058
) {
6159

62-
Text(text = "With Country Code")
6360
SelectCountryWithCountryCode()
64-
Text(text = "Without Country Code")
65-
SelectCountryWithoutCountryCode()
6661
}
6762
}
6863

6964
@Composable
7065
fun SelectCountryWithCountryCode() {
71-
var selectedCountry by rememberSaveable { mutableStateOf(getDefaultCountryCode(this)) }
66+
val getDefaultLangCode = getDefaultLangCode()
67+
val getDefaultPhoneCode = getDefaultPhoneCode()
68+
var phoneCode by rememberSaveable { mutableStateOf(getDefaultPhoneCode) }
7269
val phoneNumber = rememberSaveable { mutableStateOf("") }
73-
var defaultCountry by rememberSaveable { mutableStateOf(getDefaultCountry(this))}
74-
75-
TogiCountryCodePicker(
76-
pickedCountry = {
77-
selectedCountry = it.countryPhoneCode
78-
defaultCountry = it.countryCode
79-
80-
},
81-
defaultCountry = getLibCountries().single { it.countryCode == defaultCountry },
82-
dialogAppBarTextColor = Color.Black,
83-
dialogAppBarColor = Color.White,
84-
text = phoneNumber.value,
85-
onValueChange = { phoneNumber.value = it }
86-
)
87-
88-
}
89-
90-
@Composable
91-
fun SelectCountryWithoutCountryCode() {
92-
var selectedCountry by rememberSaveable { mutableStateOf(getDefaultCountryCode(this)) }
93-
val phoneNumber = rememberSaveable { mutableStateOf("") }
94-
var defaultCountry by rememberSaveable { mutableStateOf(getDefaultCountry(this))}
70+
var defaultLang by rememberSaveable { mutableStateOf(getDefaultLangCode) }
71+
var verifyText by remember { mutableStateOf("") }
72+
var isValidPhone by remember { mutableStateOf(true) }
73+
Column(
74+
modifier = Modifier.padding(16.dp)
75+
) {
76+
Text(
77+
text = verifyText,
78+
fontWeight = FontWeight.Bold,
79+
modifier = Modifier
80+
.fillMaxWidth()
81+
.wrapContentSize(Alignment.Center)
82+
)
83+
TogiCountryCodePicker(
84+
pickedCountry = {
85+
phoneCode = it.countryPhoneCode
86+
defaultLang = it.countryCode
87+
},
88+
defaultCountry = getLibCountries().single { it.countryCode == defaultLang },
89+
focusedBorderColor = MaterialTheme.colors.primary,
90+
unfocusedBorderColor = MaterialTheme.colors.primary,
91+
dialogAppBarTextColor = Color.Black,
92+
dialogAppBarColor = Color.White,
93+
error = isValidPhone,
94+
text = phoneNumber.value,
95+
onValueChange = { phoneNumber.value = it }
96+
)
9597

96-
TogiCountryCodePicker(
97-
pickedCountry = {
98-
selectedCountry = it.countryPhoneCode
99-
defaultCountry = it.countryCode
100-
},
101-
defaultCountry = getLibCountries().single { it.countryCode == defaultCountry},
102-
showCountryCode = false,
103-
text = phoneNumber.value,
104-
onValueChange = { phoneNumber.value = it }
105-
)
98+
val fullPhoneNumber = "$phoneCode${phoneNumber.value}"
99+
val checkPhoneNumber = checkPhoneNumber(
100+
phone = phoneNumber.value,
101+
fullPhoneNumber = fullPhoneNumber,
102+
countryCode = defaultLang
103+
)
104+
Button(
105+
onClick = {
106+
verifyText = if (checkPhoneNumber) {
107+
isValidPhone = true
108+
"Phone Number Correct"
109+
} else {
110+
isValidPhone = false
111+
"Phone Number is Wrong"
106112

107-
Text(text = "Number with * : $selectedCountry${phoneNumber.value}")
113+
}
114+
},
115+
modifier = Modifier.fillMaxWidth()
116+
.padding(16.dp)
117+
.height(60.dp)
118+
) {
119+
Text(text = "Phone Verify")
120+
}
121+
}
108122
}
109123
}

‎ccp/build.gradle‎

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -53,23 +53,11 @@ dependencies {
5353

5454
implementation 'androidx.core:core-ktx:1.7.0'
5555
implementation 'androidx.appcompat:appcompat:1.4.1'
56-
// Integration with activities
5756
implementation 'androidx.activity:activity-compose:1.4.0'
58-
// Compose Material Design
5957
implementation 'androidx.compose.material:material:1.1.1'
60-
// Animations
61-
implementation 'androidx.compose.animation:animation:1.1.1'
62-
// Tooling support (Previews, etc.)
63-
implementation 'androidx.compose.ui:ui-tooling:1.1.1'
64-
// Integration with ViewModels
6558
implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.4.1'
66-
// UI Tests
67-
androidTestImplementation 'androidx.compose.ui:ui-test-junit4:1.1.1'
68-
implementation 'com.googlecode.libphonenumber:libphonenumber:8.12.45'
59+
implementation 'com.googlecode.libphonenumber:libphonenumber:8.12.46'
6960

70-
testImplementation 'junit:junit:4.13.2'
71-
androidTestImplementation 'androidx.test.ext:junit:1.1.3'
72-
androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'
7361
}
7462

7563
afterEvaluate {

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

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

3-
import android.annotation.SuppressLint
43
import androidx.compose.foundation.Image
54
import androidx.compose.foundation.background
65
import androidx.compose.foundation.clickable
@@ -37,7 +36,6 @@ import com.togitech.ccp.data.utils.getLibCountries
3736
import com.togitech.ccp.utils.searchCountry
3837

3938
class TogiCodePicker {
40-
4139
@OptIn(ExperimentalComposeUiApi::class)
4240
@Composable
4341
fun TogiCodeDialog(
@@ -61,7 +59,7 @@ class TogiCodePicker {
6159

6260
Card(
6361
modifier = modifier
64-
.padding(3.dp)
62+
.padding(2.dp)
6563
.clickable { isOpenDialog = true }
6664
) {
6765
Column(modifier = Modifier.padding(padding)) {
@@ -70,7 +68,7 @@ class TogiCodePicker {
7068
verticalAlignment = Alignment.CenterVertically
7169
) {
7270
Image(
73-
modifier = modifier.width(30.dp),
71+
modifier = modifier.width(34.dp),
7472
painter = painterResource(
7573
id = getFlags(
7674
isPickCountry.countryCode
@@ -92,7 +90,8 @@ class TogiCodePicker {
9290
if (isOpenDialog) {
9391
Dialog(
9492
onDismissRequest = { isOpenDialog = false },
95-
properties = DialogProperties(usePlatformDefaultWidth = false),
93+
properties = DialogProperties(
94+
usePlatformDefaultWidth = false),
9695
) {
9796
Scaffold(
9897
topBar = {
@@ -139,7 +138,7 @@ class TogiCodePicker {
139138
) {
140139
Column {
141140
if (isSearch) {
142-
searchValue = DialogSearchView(
141+
searchValue = dialogSearchView(
143142
focusedBorderColor = focusedBorderColorSearch,
144143
unfocusedBorderColor = unfocusedBorderColorSearch,
145144
cursorColor = cursorColorSearch,
@@ -192,9 +191,8 @@ class TogiCodePicker {
192191
}
193192

194193

195-
@SuppressLint("ComposableNaming")
196194
@Composable
197-
private fun DialogSearchView(
195+
private fun dialogSearchView(
198196
focusedBorderColor: Color = MaterialTheme.colors.primary,
199197
unfocusedBorderColor: Color = MaterialTheme.colors.onSecondary,
200198
cursorColor: Color = MaterialTheme.colors.primary,

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

Lines changed: 69 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -4,22 +4,24 @@ import androidx.compose.foundation.layout.*
44
import androidx.compose.foundation.text.KeyboardActions
55
import androidx.compose.foundation.text.KeyboardOptions
66
import androidx.compose.material.*
7+
import androidx.compose.material.icons.Icons
8+
import androidx.compose.material.icons.filled.Warning
79
import androidx.compose.runtime.*
810
import androidx.compose.ui.Alignment
9-
import androidx.compose.ui.ExperimentalComposeUiApi
1011
import androidx.compose.ui.Modifier
1112
import androidx.compose.ui.graphics.Color
1213
import androidx.compose.ui.graphics.Shape
13-
import androidx.compose.ui.platform.LocalSoftwareKeyboardController
14+
import androidx.compose.ui.platform.LocalTextInputService
1415
import androidx.compose.ui.res.stringResource
16+
import androidx.compose.ui.text.font.FontWeight
1517
import androidx.compose.ui.text.input.KeyboardType
1618
import androidx.compose.ui.text.input.TextFieldValue
1719
import androidx.compose.ui.unit.dp
20+
import com.togitech.ccp.R
1821
import com.togitech.ccp.data.CountryData
1922
import com.togitech.ccp.data.utils.getNumberHint
2023
import com.togitech.ccp.transformation.PhoneNumberTransformation
2124

22-
@OptIn(ExperimentalComposeUiApi::class)
2325
@Composable
2426
fun TogiCountryCodePicker(
2527
text: String,
@@ -38,65 +40,81 @@ fun TogiCountryCodePicker(
3840
cursorColorSearch: Color = MaterialTheme.colors.primary,
3941
dialogAppBarColor: Color = MaterialTheme.colors.primary,
4042
dialogAppBarTextColor: Color = Color.White,
41-
42-
rowPadding: Modifier = modifier.padding(start = 12.dp, end = 16.dp, top = 12.dp, bottom = 12.dp)
43+
error: Boolean,
44+
rowPadding: Modifier = modifier.padding(start = 12.dp, end = 16.dp, top = 12.dp,bottom = 16.dp)
4345
) {
4446
var textFieldValueState by remember { mutableStateOf(TextFieldValue(text = text)) }
4547
val textFieldValue = textFieldValueState.copy(text = text)
46-
val keyboardController = LocalSoftwareKeyboardController.current
48+
val keyboardController = LocalTextInputService.current
4749
Surface(
4850
shape = shape,
4951
color = color
5052
) {
51-
Row(
52-
rowPadding,
53-
verticalAlignment = Alignment.CenterVertically,
54-
horizontalArrangement = Arrangement.Center
55-
)
56-
{
57-
OutlinedTextField(
58-
modifier = modifier
59-
.fillMaxWidth(),
53+
Column(
54+
modifier = rowPadding
55+
) {
56+
Row(
57+
verticalAlignment = Alignment.CenterVertically,
58+
horizontalArrangement = Arrangement.Center
59+
)
60+
{
61+
OutlinedTextField(
62+
modifier = modifier
63+
.fillMaxWidth(),
6064

61-
value = textFieldValue,
62-
colors = TextFieldDefaults.outlinedTextFieldColors(
63-
focusedBorderColor = focusedBorderColor,
64-
unfocusedBorderColor = unfocusedBorderColor,
65-
cursorColor = cursorColor
66-
),
67-
onValueChange = {
68-
textFieldValueState = it
69-
if (text != it.text) {
70-
onValueChange(it.text)
71-
}
72-
},
73-
singleLine = true,
74-
visualTransformation = PhoneNumberTransformation(defaultCountry.countryCode.uppercase()),
75-
placeholder = { Text(text = stringResource(id = getNumberHint(defaultCountry.countryCode))) },
76-
keyboardOptions = KeyboardOptions.Default.copy(
77-
keyboardType = KeyboardType.NumberPassword,
78-
autoCorrect = true,
79-
),
80-
keyboardActions = KeyboardActions(onDone = { keyboardController?.hide() }),
81-
leadingIcon = {
82-
Row {
83-
Column {
84-
val dialog = TogiCodePicker()
85-
dialog.TogiCodeDialog(
86-
pickedCountry = pickedCountry,
87-
defaultSelectedCountry = defaultCountry,
88-
dialogAppBarColor = dialogAppBarColor,
89-
showCountryCode = showCountryCode,
90-
focusedBorderColorSearch = focusedBorderColorSearch,
91-
unfocusedBorderColorSearch = unfocusedBorderColorSearch,
92-
cursorColorSearch = cursorColorSearch,
93-
dialogAppBarTextColor = dialogAppBarTextColor
94-
)
65+
value = textFieldValue,
66+
colors = TextFieldDefaults.outlinedTextFieldColors(
67+
focusedBorderColor = if (!error) Color.Red else focusedBorderColor,
68+
unfocusedBorderColor = if (!error) Color.Red else unfocusedBorderColor,
69+
cursorColor = cursorColor
70+
),
71+
onValueChange = {
72+
textFieldValueState = it
73+
if (text != it.text) {
74+
onValueChange(it.text)
9575
}
76+
},
77+
singleLine = true,
78+
visualTransformation = PhoneNumberTransformation(defaultCountry.countryCode.uppercase()),
79+
placeholder = { Text(text = stringResource(id = getNumberHint(defaultCountry.countryCode))) },
80+
keyboardOptions = KeyboardOptions.Default.copy(
81+
keyboardType = KeyboardType.NumberPassword,
82+
autoCorrect = true,
83+
),
84+
keyboardActions = KeyboardActions(onDone = { keyboardController?.hideSoftwareKeyboard() }),
85+
leadingIcon = {
86+
Row {
87+
Column {
88+
val dialog = TogiCodePicker()
89+
dialog.TogiCodeDialog(
90+
pickedCountry = pickedCountry,
91+
defaultSelectedCountry = defaultCountry,
92+
dialogAppBarColor = dialogAppBarColor,
93+
showCountryCode = showCountryCode,
94+
focusedBorderColorSearch = focusedBorderColorSearch,
95+
unfocusedBorderColorSearch = unfocusedBorderColorSearch,
96+
cursorColorSearch = cursorColorSearch,
97+
dialogAppBarTextColor = dialogAppBarTextColor
98+
)
99+
}
96100

101+
}
102+
},
103+
trailingIcon = {
104+
if (!error)
105+
Icon(
106+
imageVector = Icons.Filled.Warning, contentDescription = "Error",
107+
tint = MaterialTheme.colors.error
108+
)
97109
}
98-
}
99-
)
110+
)
111+
}
112+
if (!error)
113+
Text(text = stringResource(id = R.string.invalid_number),
114+
color = MaterialTheme.colors.error,
115+
style = MaterialTheme.typography.caption,
116+
fontWeight = FontWeight.Bold,
117+
modifier = Modifier.padding(top = 0.8.dp))
100118
}
101119

102120
}

0 commit comments

Comments
 (0)