Как расширить содержимое Scaffold до верхней панели в Jetpack Compose ⇐ Android

[Anonymous]

Я хочу расширить содержимое Material3 Scaffold до TopBar, но верхняя панель не должна перекрываться липким заголовком TabRow из тела содержимого при прокрутке вниз.
В настоящее время LazyColumn имеет верхнее отступ 0.dp , поэтому LazyColumn расширится до TopBar. При прокрутке вниз LazyColumn TabRow будет находиться в верхней части экрана, а не под TopBar.
Код Kotlin:

Код: Выделить всё

@OptIn(ExperimentalFoundationApi::class, ExperimentalMaterial3Api::class)
@Composable
fun ProfileScreen() {
var selectedTabIndex by remember { mutableIntStateOf(0) }
val tabTitles = listOf("About", "Moments")

Scaffold(
topBar = {
TopAppBar(
title = {},
navigationIcon = {
IconButton(onClick = { }) {
Icon(
imageVector = Icons.Filled.ArrowBack,
contentDescription = "Back"
)
}
},
colors = topAppBarColors(
containerColor = Color.Transparent,
scrolledContainerColor = Color.Transparent
),
scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior()
)

},
bottomBar = {
Divider(modifier = Modifier.clip(RoundedCornerShape(20.dp)))
Button(
onClick = {}, modifier = Modifier
.fillMaxWidth()
.padding(20.dp)
) {
Text("Edit profile")
}
}
) { paddingValue ->
LazyColumn(
modifier = Modifier
.fillMaxSize()
.padding(
top = 0.dp,
bottom = paddingValue.calculateBottomPadding()
)
.background(onBackgroundDark)
) {
item {
HeaderBackground()
}

item {
ProfileUserSection()
}

stickyHeader {
ScrollableTabRow(
selectedTabIndex = selectedTabIndex,
modifier = Modifier
.padding(10.dp, 0.dp, 10.dp, 0.dp)
.fillMaxWidth()
.clip(RoundedCornerShape(20.dp, 20.dp, 0.dp, 0.dp)),
edgePadding = 0.dp,
divider = {}
) {
tabTitles.forEachIndexed { index, title ->
Tab(selected = selectedTabIndex == index,
onClick = { selectedTabIndex = index },
text = { Text(title) })
}
}
}

item {
when (selectedTabIndex) {
0 -> TabAbout()
1 -> TabMoments()
}
}
}
}
}

Подробнее здесь: https://stackoverflow.com/questions/789 ... ck-compose