如何在Jetpack Compose中为ActionBar下方内容添加模糊效果？

你可以用Jetpack Compose的BackdropFilter配合BlurEffect来实现类似iOS的模糊背景，替换掉原来的半透明黑色背景，具体修改代码如下：

修改TopAppBar部分的代码 #

val scrollBehavior = TopAppBarDefaults.pinnedScrollBehavior()
Scaffold(
    modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
    topBar = {
        // 用Box包裹TopAppBar，添加模糊背景层
        Box(modifier = Modifier.fillMaxWidth()) {
            // 模糊背景：根据滚动状态调整透明度
            Box(
                modifier = Modifier
                    .matchParentSize()
                    .background(
                        color = Color.Black.copy(
                            alpha = if (scrollBehavior.state.isScrollInProgress || scrollBehavior.state.collapsedFraction > 0f) 0.75f else 0f
                        )
                    )
                    // 添加模糊效果，半径可按需调整
                    .backdropFilter(BlurEffect(radius = 16.dp, BlurredEdgeTreatment.Unbounded))
            )
            
            TopAppBar(
                title = { Text(currentScreen.route) },
                scrollBehavior = scrollBehavior,
                colors = TopAppBarDefaults.topAppBarColors(
                    containerColor = Color.Transparent, // 保持TopAppBar本身透明
                    navigationIconContentColor = Color.Black,
                    titleContentColor = MaterialTheme.colorScheme.primary,
                    actionIconContentColor = Color.Black
                )
            )
        }
    },
) { padding ->
    Box {
        Background()
        MainNavHost(
            modifier = Modifier.fillMaxSize(),
            navController = navController,
            contentPadding = padding
        )
    }
}

关键点说明 #

• BackdropFilter会模糊它下方的所有Compose内容，BlurEffect的radius参数控制模糊强度，16dp是接近iOS原生的效果，你可以根据需求调整。
• 通过scrollBehavior.state.collapsedFraction和isScrollInProgress控制模糊背景的透明度，和你原来的半透明逻辑保持一致：滚动时显示带模糊的半透明黑，未滚动时完全透明。
• 之前的enableEdgeToEdge()无需修改，模糊效果会自动覆盖StatusBar区域，和iOS的全屏模糊体验一致。

注意 #

• BackdropFilter对性能有轻微影响，只在必要场景使用即可。
• 你的Compose UI版本需要在1.4.0及以上才能支持BlurEffect。

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