Material 3 顶部栏容器颜色在滚动时不会改变

Question

顶部应用栏容器颜色在滚动时不会改变，颜色保持不变。使用 XML 视图可以正常工作，但 compose 则不行。

如果是一个错误或功能尚未移植用于撰写，但如果不是错误，我会错过代码中的某些内容吗？

我正在使用 Material 3 库的 1.0.1 版本。

示例代码：

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        WindowCompat.setDecorFitsSystemWindows(window, false)
        setContent {
            val uiController = rememberSystemUiController()
            uiController.setStatusBarColor(Color.Transparent)
            MyApplication5Theme {
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    Scaffold(
                        topBar = {
                            TopAppBar(
                                title = { Text("k") },
                                modifier = Modifier.statusBarsPadding(),
                            )
                        }
                    ) {
                        LazyColumn(
                            modifier = Modifier
                                .fillMaxSize()
                                .padding(it)
                        ) {
                            items((1..100).toList()) {
                                Text(it.toString(), modifier = Modifier.padding(8.dp))
                            }
                        }
                    }
                }
            }
        }
    }
}

我尝试创建一个带有顶部应用程序栏和惰性列的简单布局，我期望顶部应用程序栏容器颜色在惰性列的滚动上发生变化，但颜色保持不变。

Answer 1

可组合项TopAppBar有一个默认scrollBehavior参数。null如果你离开它null，它不会对滚动事件做出反应，你必须将它与可滚动组件连接。你可以这样做：

val scrollBehavior = TopAppBarDefaults.pinnedScrollBehavior()
Scaffold(
    modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
    topBar = { TopAppBar(scrollBehavior = scrollBehavior, ...) },
) { LazyColumn() {} }