InsetsX provides a WindowInsets utility for Compose Multiplatform.
The goal is to have a unified interface for handling WindowInsets across iOS and Android.
Once the official library supports WindowInsets, this library will be archived.
To use InsetsX, add the following dependency:
kotlin {
/* ... */
sourceSets {
val commonMain by getting {
dependencies {
implementation("com.moriatsushi.insetsx:insetsx:0.1.0-alpha10")
}
}
}
}- (option) If you are using insets for IME support, set the activity's
windowSoftInputModetoadjustResizein your AndroidManifest.xml file.
<activity
android:name=".MyActivity"
android:windowSoftInputMode="adjustResize">
</activity>- Call
WindowCompat.setDecorFitsSystemWindows()withfalsein theonCreatemethod of the activity .
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
WindowCompat.setDecorFitsSystemWindows(window, false)
}Detail: Lay out your app within window insets
- (option) If you want to use the
WindowInsetsController, useWindowInsetsUIViewControllerinstead ofComposeUIViewController.
fun MainUIViewController(): UIViewController {
return WindowInsetsUIViewController {
MyApp()
}
}This works much like Android's WindowInsets. Please note that the package name is different.
import androidx.compose.foundation.layout.windowInsetsPadding
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import com.moriatsushi.insetsx.systemBars
import com.moriatsushi.insetsx.systemBarsPadding
@Composable
fun Sample() {
val modifier1 = Modifier
.windowInsetsPadding(WindowInsets.safeDrawing)
val modifier2 = Modifier
.safeDrawingPadding()
}| API | android | ios |
|---|---|---|
| WindowInsets.safeArea | system bars + display cutouts | SafeArea |
| WindowInsets.systemBars | status bar + navigation bar | home indicator + status bar |
| WindowInsets.navigationBars | navigation bar | home indicator |
| WindowInsets.statusBars | status bar | status bar |
| WindowInsets.ime *1 | software keyboard | software keyboard |
| WindowInsets.safeDrawing *1 | system bars + software keyboard | SafeArea + software keyboard |
| (Modifier) | ||
| Modifier.safeAreaPadding() | system bars + display cutouts | SafeArea |
| Modifier.systemBarsPadding() | status bar + navigation bar | home indicator + status bar |
| Modifier.navigationBarsPadding() | navigation bar | home indicator |
| Modifier.statusBarsPadding() | status bar | status bar |
| Modifier.imePadding() *1 | software keyboard | software keyboard |
| Modifier.safeDrawingPadding() *1 | system bars + software keyboard | SafeArea + software keyboard |
*1 is experimental
WindowInsetsController can be used to change colors of system bars.
@Composable
fun Sample() {
val windowInsetsController = rememberWindowInsetsController()
LaunchedEffect(Unit) {
// The status bars icon + content will change to a light color
windowInsetsController?.setStatusBarContentColor(dark = false)
// The navigation bars icons will change to a light color (android only)
windowInsetsController?.setNavigationBarsContentColor(dark = false)
}
}You can also hide WindowInsets.
@Composable
fun Sample() {
val windowInsetsController = rememberWindowInsetsController()
LaunchedEffect(Unit) {
// Hide the status bars
windowInsetsController?.setIsStatusBarsVisible(false)
// Hide the navigation bars
windowInsetsController?.setIsNavigationBarsVisible(false)
// Change an options for behavior when system bars are hidden
windowInsetsController?.setSystemBarsBehavior(SystemBarsBehavior.Immersive)
}
}