Jetpack Compose：离开组合时如何还原Edge-to-Edge设置

要实现特定页面启用Edge-to-Edge，离开时恢复原有设置，核心思路是启用前保存系统栏的原始状态，销毁时逐一还原。因为enableEdgeToEdge()本质是修改了状态栏、导航栏的颜色和系统UI可见性，没有直接的禁用方法，我们手动还原这些参数即可。

具体实现步骤 #

在你的全屏可组合项中使用DisposableEffect，完成以下操作：

• 获取当前页面的Window实例
• 保存状态栏、导航栏的原始状态（颜色、文字明暗模式、系统UI可见性）
• 调用enableEdgeToEdge()启用全屏效果
• 在onDispose回调中，将保存的原始状态逐一还原

代码示例 #

@Composable
fun FullScreenPage() {
    val context = LocalContext.current
    val window = (context as ComponentActivity).window
    val insetsController = WindowInsetsControllerCompat(window, window.decorView)

    DisposableEffect(Unit) {
        // 保存系统栏原始状态
        val originalStatusBarColor = window.statusBarColor
        val originalStatusBarLight = insetsController.isAppearanceLightStatusBars
        val originalNavBarColor = window.navigationBarColor
        val originalNavBarLight = insetsController.isAppearanceLightNavigationBars
        val originalSystemUiVisibility = window.decorView.systemUiVisibility

        // 启用Edge-to-Edge全屏
        (context as ComponentActivity).enableEdgeToEdge()

        onDispose {
            // 恢复状态栏状态
            window.statusBarColor = originalStatusBarColor
            insetsController.isAppearanceLightStatusBars = originalStatusBarLight
            // 恢复导航栏状态
            window.navigationBarColor = originalNavBarColor
            insetsController.isAppearanceLightNavigationBars = originalNavBarLight
            // 恢复系统UI可见性设置
            window.decorView.systemUiVisibility = originalSystemUiVisibility
        }
    }

    // 页面内容区域
    Box(modifier = Modifier.fillMaxSize()) {
        // ... 你的页面UI代码
    }
}

关键说明 #

• enableEdgeToEdge()会将状态栏、导航栏设为透明，并调整系统UI可见性，我们通过保存这些参数的原始值，在页面销毁时完全还原，就能避免影响其他页面。
• 使用WindowInsetsControllerCompat可以精准控制状态栏、导航栏的文字明暗模式，这也是enableEdgeToEdge()会修改的核心内容之一。
• DisposableEffect的执行时机刚好匹配页面生命周期：进入页面时保存状态并启用全屏，离开页面时自动触发onDispose恢复设置。

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