Status Update
Comments
ja...@gmail.com <ja...@gmail.com> #2
Found solution!
1. In ModalBottomSheet you need to add windowInsets:
```
ModalBottomSheet(
modifier = Modifier,
sheetState = sheetState,
onDismissRequest = onSheetDismissed,
windowInsets = WindowInsets.safeDrawing, // SO IMPORTANT!
)
```
2. On your activity / fragment `setDecorFitsSystemWindows(window, false)`
3. In manifest add to your activity: `android:windowSoftInputMode="adjustResize"`
4. In `setContent` add `Box` with `safeDrawingPadding()` (Useful when the bottom sheet is larger than the space between the top of the screen and the keyboard):
```
findViewById<ComposeView>(R.id.compose_view).setContent {
// You're in Compose world!
MaterialTheme {
Surface(
modifier = Modifier
.fillMaxSize(),
color = MaterialTheme.colorScheme.background,
) {
Box(
modifier = Modifier
.safeDrawingPadding()
) {
PlantDetailDescription()
}
}
}
}
```
1. In ModalBottomSheet you need to add windowInsets:
```
ModalBottomSheet(
modifier = Modifier,
sheetState = sheetState,
onDismissRequest = onSheetDismissed,
windowInsets = WindowInsets.safeDrawing, // SO IMPORTANT!
)
```
2. On your activity / fragment `setDecorFitsSystemWindows(window, false)`
3. In manifest add to your activity: `android:windowSoftInputMode="adjustResize"`
4. In `setContent` add `Box` with `safeDrawingPadding()` (Useful when the bottom sheet is larger than the space between the top of the screen and the keyboard):
```
findViewById<ComposeView>(R.id.compose_view).setContent {
// You're in Compose world!
MaterialTheme {
Surface(
modifier = Modifier
.fillMaxSize(),
color = MaterialTheme.colorScheme.background,
) {
Box(
modifier = Modifier
.safeDrawingPadding()
) {
PlantDetailDescription()
}
}
}
}
```
da...@gmail.com <da...@gmail.com> #3
With this solution, the modal bottom sheet's animation doesn't correctly add the padding if they're too many fields in its content.
Description
val composeBom = platform("androidx.compose:compose-bom:2024.01.00")
implementation(composeBom)
implementation("androidx.compose.runtime:runtime")
implementation("androidx.compose.ui:ui")
implementation( "androidx.compose.foundation:foundation")
implementation ("androidx.compose.foundation:foundation-layout")
implementation ("androidx.compose.runtime:runtime-livedata")
implementation ("androidx.compose.ui:ui-tooling")
implementation ("androidx.compose.material3:material3:1.2.0") // change to material3 - 1.2.0
....
composeOptions { kotlinCompilerExtensionVersion = "1.5.7"}
--------------------------------
Android Studio Build:
Android Studio Hedgehog | 2023.1.1
Build #AI-231.9392.1.2311.11076708, built on November 9, 2023
Runtime version: 17.0.7+0-b2043.56-10550314 amd64
--------------------------------
Kotlin version: 1.9.21
--------------------------------
Steps to Reproduce or Code Sample to Reproduce:
1. Create xml project
2. Add compose to project
3. Create xml Activity (AppCompatActivity)
4. Create xml Fragment with ComposeView
5. In Fragment add ModalBottomSheet with TextField
6. When you click TextField all ModalBottomSheet content is hide by keyboard.
--------------------------------
What I tried:
1. Set acitivity parameter: android:windowSoftInputMode="adjustResize"
2. Set on activity onCreate: setDecorFitsSystemWindows(window, false)
3. Add imePadding() to ModalBottomSheet modifier.
--------------------------------
Tested on API26
I added sample project and movie