Android Jetpack Compose适配平板与手机的Window Insets问题

一、判断何时需要适配Window Insets #

你需要在以下场景中考虑适配Window Insets：

• 系统UI元素（底部软件导航栏、状态栏、刘海/挖孔屏）直接覆盖了应用内容区域时
• 设备存在动态显示/隐藏的系统UI（如平板的可切换软件导航栏、手机的可隐藏状态栏）
• 应用内的固定位置组件（如底部操作栏、悬浮按钮）需要避开系统UI防止被遮挡时
• 横竖屏切换、折叠屏形态变化等场景下，Insets区域发生动态调整时

二、检测并响应任意设备的所有Window Insets #

1. 精准识别Insets类型 #

Compose提供了多种Insets类型，可针对不同系统UI做适配：

• WindowInsets.systemBars：包含状态栏和导航栏区域
• WindowInsets.navigationBars：仅底部导航栏区域
• WindowInsets.statusBars：仅顶部状态栏区域
• WindowInsets.displayCutout：刘海/挖孔屏的遮挡区域

2. 动态监听并条件式适配 #

不要全局添加固定padding，而是根据Insets的实际存在情况动态调整：

@Composable
fun AdaptiveScreen() {
    // 获取当前窗口的Insets实例
    val windowInsets = rememberWindowInsets()
    // 仅获取导航栏的Insets数据
    val navBarInsets = windowInsets.getInsets(WindowInsets.navigationBars)
    
    // 仅当底部存在导航栏Insets时，添加对应padding
    val bottomPadding = if (navBarInsets.bottom > 0) navBarInsets.bottom.dp else 0.dp

    Box(
        modifier = Modifier
            .fillMaxSize()
            .padding(bottom = bottomPadding)
    ) {
        // 你的页面内容
    }
}

也可以直接使用Modifier.windowInsetsPadding结合可见性判断，更简洁：

@Composable
fun AdaptiveScreen() {
    val navBarInsets = WindowInsets.navigationBars
    
    Box(
        modifier = Modifier
            .fillMaxSize()
            .then(
                if (navBarInsets.isVisible) {
                    Modifier.windowInsetsPadding(navBarInsets)
                } else {
                    Modifier
                }
            )
    ) {
        // 你的页面内容
    }
}

3. 控制系统UI显示逻辑（可选） #

如果需要让内容延伸到系统UI下方，再针对性添加padding，可以用WindowInsetsController：

@Composable
fun ExtendedScreen() {
    val windowInsetsController = rememberWindowInsetsController()
    
    LaunchedEffect(Unit) {
        // 隐藏导航栏，允许滑动唤起
        windowInsetsController.hide(WindowInsets.navigationBars)
        windowInsetsController.systemBarsBehavior = WindowInsetsController.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
    }

    // 针对导航栏区域添加padding，避免内容被遮挡
    Box(
        modifier = Modifier
            .fillMaxSize()
            .windowInsetsPadding(WindowInsets.navigationBars)
    ) {
        // 你的页面内容
    }
}

三、通用适配原则 #

• 优先使用Compose封装好的Modifier.systemBarsPadding()、Modifier.navigationBarsPadding()等方法，这些方法会自动识别Insets是否存在，仅在需要时添加padding
• 避免在根布局全局设置固定padding，而是在需要避开系统UI的局部容器上单独添加适配
• 多设备测试：覆盖带软件导航栏的平板、刘海屏手机、折叠屏、无物理导航键的全屏手机等场景，验证适配逻辑的通用性

内容的提问来源于stack exchange，提问作者Hector