A vertical page indicator that can temporarily display a gesture indicator to demonstrate how to navigate between pages using one-handed gestures.
OneHandedGestureVerticalPagerSample
@Composable
fun OneHandedGestureVerticalPagerSample() {
val pagerState = rememberPagerState(pageCount = { 10 })
var pageGestureIndicatorVisible by remember { mutableStateOf(false) }
VerticalPagerScaffold(
pagerState = pagerState,
pageIndicator = {
OneHandedGestureVerticalPageIndicator(
pagerState = pagerState,
gestureIndicatorVisible = pageGestureIndicatorVisible,
onGestureIndicatorFinished = { pageGestureIndicatorVisible = false },
)
},
) {
VerticalPager(
state = pagerState,
modifier =
Modifier.oneHandedGesture(
action = GestureAction.Primary,
onShowIndicator = { pageGestureIndicatorVisible = true },
) {
OneHandedGestureDefaults.scrollToNextPage(pagerState)
},
) { page ->
AnimatedPage(pageIndex = page, pagerState = pagerState) {
ScreenScaffold {
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center,
) {
Text(text = "Page #$page")
Spacer(modifier = Modifier.height(8.dp))
Text(text = "Swipe up and down")
}
}
}
}
}
}