Input number is incorrect，Who knows what the probl...

# compose-ios

[zfan93]

Input number is incorrect，Who knows what the problem is，thanks

RPReplay_Final1697095203.MP4

[zfan93]

The cursor is chaotic, pay attention to the first digit 0 entered

[Jan]

love the music 😉

[zfan93]

😄

[Elijah Semyonov]

Hey! Thanks for the report! Does the bug arise, if you set English language layout as a default one? Then we will know better, which direction to delve in to resolve it.

[Elijah Semyonov]

Created an issue, feel free to add more context in the thread there

[Alexander Maryanovsky]

Are you using a StateFlow or some other delayed mechanism when updating the TextFieldValue?

[zfan93]

the state:

class PhoneScreenModel(private val navigator: Navigator) : MyViewModel() {
    val phone = MutableStateFlow("")
    fun updatePhone(newPhone: String) {
        if (newPhone.length <= 11 && newPhone.all { it.isDigit() }) {
            phone.value = newPhone
        }
    }

the textfield:

TextField(
                        modifier = Modifier.fillMaxWidth().padding(bottom = 16.dp).border(
                            1.dp,
                            color = MaterialTheme.colorScheme.primary,
                            shape = RoundedCornerShape(8.dp)
                        ),
                        value = phone,
                        onValueChange = { newPhone ->
                            if (newPhone.length <= 11 && newPhone.all { it.isDigit() } && (newPhone.startsWith(
                                    "1"
                                ) || newPhone.isEmpty())) {
                                phoneScreenModel.updatePhone(newPhone)
                                if (newPhone.length == 11) {
                                    keyboardController?.hide()
                                    navigator.push(CodeScreen(newPhone))
                                }
                            }

                        }, colors = TextFieldDefaults.colors(
                            unfocusedContainerColor = MaterialTheme.colorScheme.background,
                            focusedContainerColor = MaterialTheme.colorScheme.background,
                            unfocusedIndicatorColor = Color.Transparent,
                            focusedIndicatorColor = Color.Transparent,
                            focusedTextColor = MaterialTheme.colorScheme.primary,
                            unfocusedTextColor = MaterialTheme.colorScheme.primary,
                        ),
                        shape = RoundedCornerShape(8.dp),
                        placeholder = {
                            Box(
                                modifier = Modifier.fillMaxWidth().height(26.dp),
                                contentAlignment = Alignment.Center
                            ) {
                                Text(
                                    text = "请输入手机号",
                                    color = MaterialTheme.colorScheme.primary
                                )
                            }

                        },
                        textStyle = TextStyle(textAlign = TextAlign.Center, fontSize = 20.sp),
                        keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number)
                    )

[Alexander Zhirkevich]

https://medium.com/androiddevelopers/effective-state-management-for-textfield-in-compose-d6e5b070fbe5

[Alexander Maryanovsky]

Yeah, this is a known issue on the Google side of Jetpack Compose. It should be fixed soon-ish, I believe.

[zfan93]

我发现原生输入软件是没有问题的，我用的三方输入软件会有问题

RPReplay_Final1697111415.MP4

[zfan93]

I found that there is no problem with the native input software, but there may be issues with the third-party input software I use

[Alexander Zhirkevich]

Just a coincidence i guess. You are managing your text field state in a little wrong way. Read the article above, should be helpful

[Elijah Semyonov]

I close the issue then.

[zfan93]

i use “mutablestateof” solve this problem，thanks a lot

[Arkadii Ivanov]

As already mentioned, this is a known issue: https://kotlinlang.slack.com/archives/C01403U1ZGW/p1672416240342609?thread_ts=1672414132.375969&cid=C01403U1ZGW

A solution is to collect the Flow on Main.immediate dispatcher. I believe by default Compose uses just Main.