android - Jetpack Compose 中的折叠工具栏

Question

如何使用 Jetpack Compose 构建 Instagram 个人资料页面。我尝试了多个库，例如 NestedScrollView , CollapsingToolbar获得可折叠/可滚动的顶部栏，但它们看起来并不流畅。使用 CoordinatorLayout 可以很容易地使用 XML 进行构建。

预期滚动:- Instagram Profile Page

使用 NestedScrollView 库:- NestedScrollView

Answer 1

这个布局很容易用 LazyColumn 和 stickyHeader 实现:

LazyColumn(Modifier.fillMaxWidth()) {
    item {
        Text("Header")
    }
    stickyHeader {
        TabRow(selectedTabIndex = 0) {
            repeat(4) {
                Tab(selected = it == 0, onClick = {}) {
                    Text(
                        it.toString()
                    )
                }
            }
        }
    }
    items(100) {
        Text(it.toString())
    }
}