Compose rise text field up when typing text

Question

my textfield is overshadoved when I try to input data:

what can I do?

Answer 1

setContent {
ProvideWindowInsets {
    JetpackComposeInsetsTheme {
        Surface(
            color = Color.Yellow,
            modifier = Modifier.fillMaxSize()
        ) {
            ContentView(modifier = Modifier
                .navigationBarsWithImePadding())
        }
    }
}
}

https://google.github.io/accompanist/api/insets/insets/com.google.accompanist.insets/ime-padding.html

https://medium.com/mobile-app-development-publication/android-jetpack-compose-inset-padding-made-easy-5f156a790979

Answer 2

1. Add this in your AndroidManifest.xml in your activity and this will adjust the layout resize option.

<activity
    android:name=".ActivityName"
    android:windowSoftInputMode="adjustResize"
    android:label="@string/app_name">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>

2. Add this Modifier to the TextField.

modifier = Modifier.navigationBarsWithImePadding(),

Refer this sample app for complete implementation.

Note

1. This is not a very good solution as there are a lot of caveats.
   I have added this as there is no official solution and this is the code used in google code samples.
2. This works only if there is a single TextField on the screen. I am working with forms and this doesn't work.
3. The TextField must be the last view vertically.

Answer 3

If you add this in you Activity, worked fine for me

<activity
    android:name=".MainActivity"
    android:windowSoftInputMode="adjustResize"
    ...>

In addition to that, you can add a scroll to your screen... I'm adding my entire test code just to illustrate.

@Composable
fun BigFormScreen() {
    var text by remember {
        mutableStateOf("")
    }
    Column(
        Modifier
            .fillMaxSize()
            .verticalScroll(rememberScrollState()),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Image(
            painterResource(id = R.drawable.ic_android_orange),
            contentDescription = null,
            modifier = Modifier.size(300.dp)
        )
        TextField(value = text, onValueChange = { text = it })
    }
}