*Text fields in a Compose `Dialog` jitter on each ...

# multiplatform

[youssef hachicha]

Text fields in a Compose Dialog jitter on each keystroke once the keyboard shows what's the right fix? more details in the thread

WhatsApp Video 2026-06-15 at 11.56.39.mp4

[youssef hachicha]

Environment
• Compose Multiplatform`1.9.3`, Kotlin`2.2.0`
• Android,compileSdk/targetSdk 36,minSdk 25
• Activity uses`enableEdgeToEdge()`
Minimal repro:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        enableEdgeToEdge()
        super.onCreate(savedInstanceState)
        setContent { KeyboardInDialogRepro() }
    }
}

@Composable
private fun KeyboardInDialogRepro() {
    var showDialog by remember { mutableStateOf(false) }
    Button(onClick = { showDialog = true }) { Text("Open Dialog") }
    if (showDialog) {
        Dialog(
            onDismissRequest = { showDialog = false },
            properties = DialogProperties(usePlatformDefaultWidth = false),
        ) {
            val values = remember { mutableStateListOf(*Array(10) { "" }) }
            LazyColumn(
                modifier = Modifier.fillMaxSize().imePadding().padding(16.dp),
                verticalArrangement = Arrangement.spacedBy(8.dp),
            ) {
                itemsIndexed(values) { index, text ->
                    OutlinedTextField(
                        value = text,
                        onValueChange = { values[index] = it },
                        label = { Text("Field $index") },
                        modifier = Modifier.fillMaxWidth(),
                    )
                }
            }
        }
    }
}

[Abraham Golor]

The jitter is coming because you are doing this .imePadding().padding(16.dp)

Instead do this:

LazyColumn(
 modifier = Modifier 
 .fillMaxSize(), 
contentPadding = paddingValues(
top = 16.dp, 
start = 16.dp,
end = 16.dp
bottom = 16.dp + ime.getBottom(LocalDensity.current)
),
verticalArrangement = Arrangement.spacedBy(8.dp)
) {

}

[Abraham Golor]

The reason why it happens is that anytime the input field changes onValueChanged is called which triggers recomposition and the layout is recalculated which causes the ime to animate causing the jitter you are seeing

[youssef hachicha]

Thanks, WindowInsets.ime was the right idea but two things were missing.

First, the dialog was not getting IME insets at all. A Compose Dialog lives in its own window that fits system windows by default and never gets the IME animation callbacks, so ime.getBottom() read zero. Setting DialogProperties(decorFitsSystemWindows = false) fixed that, and second, contentPadding only adds blank space, it doesn't shrink the scroll viewport, so the field never scrolled above the keyboard. Modifier.imePadding() on the container does shrink the bounds.