I am working on a auto scroller for my horizontal pager. Is should auto scroll every 3 seconds. Should be able to skip when clicked. And pause when longClicked. When in the paused state. It will resume when the user swipes or clickes to skip. However, my isPaused state always seems to be false in the LaunchedEffect. I think there is something wrong with the way I am handling my state.
I set the isPaused to intialize as false. As we are not paused when first entering the screen
When longClicked I set the isPaused to true
And to resume in the click or swipe I set back to false.
This looks strange as I set to true, but the LaunchedEffect gets triggered twice, and is false
onLongClick true
LaunchedEffect false
LaunchedEffect false
val coroutineScope = rememberCoroutineScope()
var isPaused by remember { mutableStateOf(false) }
LaunchedEffect(isPaused) {
println("LaunchedEffect $isPaused")
while (!isPaused) {
delay(3_000)
var nextPage = pagerState.currentPage + 1
if (nextPage >= items.count()) {
nextPage = 0
}
pagerState.animateScrollToPage(nextPage)
}
}
My horizontal pager looks like this
HorizontalPager(
state = pagerState,
pageSpacing = 16.dp,
modifier = modifier
.fillMaxSize()
.combinedClickable(
onLongClick = {
isPaused = true
println("onLongClick $isPaused")
},
onClick = {
if(pagerState.currentPage < items.count()) {
isPaused = false
println("onClick $isPaused")
coroutineScope.launch {
pagerState.animateScrollToPage(pagerState.currentPage + 1)
}
}
}
)
) { pageIndex ->
when(pageIndex) {
in items.indices -> {
isPaused = false
content(items[pageIndex])
}
else -> {
lastItemContent?.invoke()
}
}
}
The problem lies within this code bit:
in items.indices -> {
isPaused = false // HERE
content(items[pageIndex])
}
Whenever a recomposition of the content
of HorizontalPager
occurs, isPaused
will be reset to false
.
To set isPaused
to false
only when the user manually is swiping, you can use another LaunchedEffect
like this:
LaunchedEffect(pagerState.currentPage) {
isPaused = false
}
The content
might get recomposed whenever the isPaused
changes because the whole HorizontalPager
is within the same recomposition scope.