Scroll an item vertically in/out of view based on scroll state provided by a scrolling list.
@Composable
fun ScrollAwaySample() {
val state = rememberTransformingLazyColumnState()
Box(modifier = Modifier.fillMaxSize()) {
TransformingLazyColumn(state = state, modifier = Modifier.fillMaxSize()) {
item {
ListHeader(
modifier =
Modifier.minimumVerticalContentPadding(
ListHeaderDefaults.minimumTopListContentPadding,
ListHeaderDefaults.minimumBottomListContentPadding,
)
) {
Text(
modifier = Modifier.fillMaxWidth(),
text = "TLC",
textAlign = TextAlign.Center,
)
}
}
items(50) {
FilledTonalButton(
modifier =
Modifier.fillMaxWidth()
.padding(horizontal = 36.dp)
.minimumVerticalContentPadding(
ButtonDefaults.minimumVerticalListContentPadding
),
onClick = {},
label = { Text("Item ${it + 1}") },
)
}
}
TimeText(
// In practice, it is recommended to use the [AppScaffold] and [ScreenScaffold],
// so that the Material3 scroll away behavior is provided by default, rather than using
// [Modifier.scrollAway] directly.
modifier =
Modifier.scrollAway(
scrollInfoProvider = ScrollInfoProvider(state),
screenStage = {
if (state.isScrollInProgress) ScreenStage.Scrolling else ScreenStage.Idle
},
),
content = { time ->
curvedText("List")
timeTextSeparator()
curvedText(time)
},
)
}
}