https://kotlinlang.org logo
#compose
Title
# compose
t

Tobias Gronbach

03/04/2022, 4:32 PM
I have a Textfield (1) that is set to readonly. It has Modifier.clickable to open a Dialog that also contains at Textfield (2) and onValueChanged updates Text in (1) . Everything is working exactly as expected. On dismissing the Dialog it disappears and Softkeyboard is hidden as expected but only a moment later the Softkeyboard pops up again. I tried to remove focus in onDismissed also tried to manually hide softkeyboard but none of my attempts worked. I don't know what else to try and I don't understand why it even pops up? Do you have an idea?
r

ritesh

03/04/2022, 4:36 PM
Probably when your composable gets recomposed it's mutating the state which your dialog is dependent on. And that code should be handled in vm or be wrapped in a effect handler.
t

Tobias Gronbach

03/04/2022, 4:41 PM
If I understand you correctly then it would also show the Dialog again which is not the case.
Copy code
@Composable
fun ReadOnlyTextField(
    onValueChangedListener: (text: String) -> Unit
) {

    var text by remember { mutableStateOf("") }
    var showDialog by remember { mutableStateOf(false) }

    if (showDialog) {
        DialogTextInput(
            onDismissed = {
                showDialog = false
            },
            onValueChangedListener = {
                text = it
            },
            text = text
        )
    }

    TextField(
        modifier = Modifier.clickable {
            showDialog = !showDialog
        },
        value = text,
        enabled = false,
        onValueChange = {
            onValueChangedListener(it)
        },
        readOnly = true
    )
}
Copy code
@Composable
fun DialogTextInput(
    onDismissed: () -> Unit,
    onValueChangedListener: (text: String) -> Unit,
    text: String,
) {

    Dialog(
        onDismissRequest = {
            onDismissed()
        },
        properties = DialogProperties(dismissOnBackPress = true, dismissOnClickOutside = true)
    ) {
        Surface(
            modifier = Modifier
                .padding(10.dp),
            color = MaterialTheme.colors.background,
            contentColor = MaterialTheme.colors.onBackground
        ) {
            TextField(
                value = text,
                onValueChange = {
                    onValueChangedListener(it)
                },
                keyboardOptions = KeyboardOptions(imeAction = ImeAction.Done),
                keyboardActions = KeyboardActions(
                    onDone = {
                        onDismissed()
                    }
                )
            )
        }
    }
}
r

ritesh

03/04/2022, 4:47 PM
I had read initial question as dialog popping up again .
t

Tobias Gronbach

03/09/2022, 11:05 PM
What partly worked so far is to use LocalFocusManager.current INSIDE of the Dialog and call the clearFocus for example in onDone of the TextField. What still doesn't work is the case when the user dismisses the dialog via onBackPress or by clicking outside of the dialog. Then the unwanted behaviour persists. I dont't know how to get access to LocalFocusManager.current in onDismissRequest of the dialog?
2 Views