Enormous ime padding in Jetpack Compose

Question

I have a pinned bottom container with a textfield. And i use imePadding modifier. When keyboard appears seems like imePadding works twice. It happens only on some devices. Particular my is Samsung Galaxy A80 (Android 11)

Code example

        Scaffold(
            modifier = Modifier.fillMaxSize(),
            bottomBar = {
                Box(
                    Modifier
                        .imePadding()
                        .height(100.dp)
                        .background(Color.Red),
                ) {
                    BasicTextField(
                        modifier = Modifier.fillMaxWidth(),
                        value = "some text",
                        onValueChange = {},
                    )
                }
            },
        ) {
            Box(
                Modifier.fillMaxSize().padding(bottom = it.calculateBottomPadding()),
            ) {
                LazyColumn(
                    modifier = Modifier.fillMaxSize(),
                ) {
                    repeat((0..100).count()) {
                        item {
                            Box(Modifier.fillMaxWidth().height(100.dp).background(Color.Blue)) {
                            }
                        }
                    }
                }
            }
        }

UPD Issue reproduce when I add:

window.addFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS)

@Srimani789 here the example When I don't use imePadding on BasicTextField container devices without issue doesn't adjust the screen and there is no padding as expected. But in the same case problematical devices still have imePadding exectly to textfield — Vadim Zhukov, Apr 15 '23 at 08:41
Hey @VadimZhukov have you managed to resolve your issue? I am observing a similar thing happening on some Samsung devices. — scana, May 23 '23 at 11:12

Sri mani789 · Answer 1 · 2023-04-23T02:14:17.490

add this line to activity in AndroidManifest.xml file android:windowSoftInputMode="adjustResize". The activity's layout will be resized to ensure that all of its visible content remains visible even when the soft keyboard is shown without using any imePadding() modifiers.

here you can see improved code.

var value by remember { mutableStateOf("") }
Scaffold(
    bottomBar = {
        Box(modifier = Modifier
            .fillMaxWidth()
            .background(MaterialTheme.colorScheme.surface)) {
            OutlinedTextField(
                modifier = Modifier.fillMaxWidth(), value = value,
                onValueChange = { value = it }
            )
        }
    },
) { paddingValues ->
    LazyColumn(
        modifier = Modifier
            .fillMaxSize()
            .padding(paddingValues),
        contentPadding = PaddingValues(12.dp, 16.dp),
        verticalArrangement = Arrangement.spacedBy(4.dp),
    ) {
        items(100) {
            Card(modifier = Modifier.fillMaxSize()) {
                Text(text = "Item $it",  modifier = Modifier.padding(8.dp))
            }
        }
    }
}

Enormous ime padding in Jetpack Compose

1 Answers1