Jetpack Compose：如何仅为指定屏幕修改状态栏颜色？

你的问题核心是DisposableEffect(Unit)的触发时机和TopAppBar的渲染时机不匹配，导致状态栏颜色更新有延迟。下面是两种更可靠的实现方式：

方案1：绑定导航路由（推荐） #

利用导航组件的路由状态作为触发条件，确保状态栏颜色在路由切换时立刻更新/恢复，完全和屏幕切换同步：

@Composable
fun SpecificScreen(
    navController: NavController,
    systemUiController: SystemUiController = rememberSystemUiController(),
    colors: MyColors = LocalMyColors.current // 从主题获取预设颜色
) {
    // 监听当前路由变化
    val currentRoute = navController.currentBackStackEntryAsState().value?.destination?.route

    DisposableEffect(currentRoute) {
        // 进入当前屏幕时设置自定义状态栏颜色
        if (currentRoute == "你的特定屏幕路由") {
            systemUiController.setStatusBarColor(color = colors.anotherStatusBarColor)
        }
        // 离开屏幕时恢复默认颜色
        onDispose {
            if (navController.currentBackStackEntryAsState().value?.destination?.route != "你的特定屏幕路由") {
                systemUiController.setStatusBarColor(color = colors.defaultStatusBarColor)
            }
        }
    }

    Scaffold(
        topBar = {
            TopAppBar(
                title = { Text("特定屏幕") },
                colors = TopAppBarDefaults.topAppBarColors(
                    containerColor = colors.anotherStatusBarColor // 和状态栏颜色统一
                )
            )
        }
    ) { paddingValues ->
        // 屏幕内容区域
        Box(modifier = Modifier.padding(paddingValues)) {
            // ...
        }
    }
}

方案2：组合LaunchedEffect与DisposableEffect #

通过LaunchedEffect在组件进入组合时立刻更新状态栏颜色，配合DisposableEffect在组件销毁时恢复，缩小和TopAppBar的渲染时差：

@Composable
fun SpecificScreen(
    systemUiController: SystemUiController = rememberSystemUiController(),
    colors: MyColors = LocalMyColors.current
) {
    // 组件首次组合时立刻设置状态栏颜色
    LaunchedEffect(Unit) {
        systemUiController.setStatusBarColor(color = colors.anotherStatusBarColor)
    }

    // 组件销毁时恢复默认颜色
    DisposableEffect(Unit) {
        onDispose {
            systemUiController.setStatusBarColor(color = colors.defaultStatusBarColor)
        }
    }

    Scaffold(
        topBar = {
            TopAppBar(
                title = { Text("特定屏幕") },
                colors = TopAppBarDefaults.topAppBarColors(
                    containerColor = colors.anotherStatusBarColor
                )
            )
        }
    ) { paddingValues ->
        // 屏幕内容
    }
}

为什么原来的方案有延迟？ #

DisposableEffect(Unit)的回调会在组件首次组合完成后才执行，而TopAppBar的渲染是在组合过程中进行的，两者存在时间差，所以会出现状态栏颜色更新滞后的现象。

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