HorizontalPager scrolling bug.

[ijero]

Describe the bug

Calling pagerState.animateScrollToPage() always doesn't scroll to the full next page, it happens in v0.24.3-alpha version.

When I try to downgrade to v0.24.2-alpha it works fine.

To Reproduce

Steps to reproduce the behavior:

1. Import 0.24.3-alpha:

def accompanist = "0.24.3-alpha"
implementation "com.google.accompanist:accompanist-pager:$accompanist"

2. Use code:

    val pagerState = rememberPagerState()
    LaunchedEffect(key1 = pagerState.currentPage) {
        logd(
            "LaunchedEffect",
            "pageCount=${pagerState.pageCount}, currentPage=${pagerState.currentPage}"
        )
        delay(2000)
        logd(
            "LaunchedEffect",
            "scroll to ${pagerState.currentPage.inc() % pagerState.pageCount} page."
        )
        pagerState.animateScrollToPage(pagerState.currentPage.inc() % pagerState.pageCount)
    }
    HorizontalPager(
        modifier = Modifier
            .fillMaxWidth()
            .aspectRatio(1961 / 862f),
        count = bannerState.value.size,
        state = pagerState,
    ){
    // ...
   }

3. Log print:

 D/LaunchedEffect: pageCount=0, currentPage=0
 D/LaunchedEffect: scroll to 1 page.
 D/LaunchedEffect: pageCount=4, currentPage=1
 D/LaunchedEffect: scroll to 2 page.
 D/LaunchedEffect: pageCount=4, currentPage=2
 D/LaunchedEffect: scroll to 3 page.
 D/LaunchedEffect: pageCount=4, currentPage=3
 D/LaunchedEffect: scroll to 0 page.
 D/LaunchedEffect: pageCount=4, currentPage=2

Expected behavior

Screenshots?

Environment:

• Android OS version: Android 10.0
• Device: Emulator, Google Pixel 2 XL
• Accompanist version: v0.24.3-alpha

Additional context

Add any other context about the problem here.

[andkulikov]

Can you please help me understand why you write
LaunchedEffect(key1 = pagerState.currentPage)
Why do you want to re-start the scrolling everytime current page changes?
I think what happens is that now pagerState.currentPage changes in the middle of the scrolling and it cancels the previous scrolling coroutine.
do you just need an infinite automatic scroller?
maybe something like

    LaunchedEffect(key1 = pagerState) {
        while(true) {
              delay(2000)
              pagerState.animateScrollToPage(pagerState.currentPage.inc() % pagerState.pageCount)
        }
    }

will be more appropriate

[ijero]

Can you please help me understand why you write LaunchedEffect(key1 = pagerState.currentPage) Why do you want to re-start the scrolling everytime current page changes? I think what happens is that now pagerState.currentPage changes in the middle of the scrolling and it cancels the previous scrolling coroutine. do you just need an infinite automatic scroller? maybe something like

    LaunchedEffect(key1 = pagerState) {
        while(true) {
              delay(2000)
              pagerState.animateScrollToPage(pagerState.currentPage.inc() % pagerState.pageCount)
        }
    }

will be more appropriate

Thanks for your reply, I tried to use while(true) in LaunchedEffect, but when I actively swipe the Pager, the code in LaunchedEffect doesn't execute anymore, is there any other solution?

[andkulikov]

Could you please explain your requirements? So user can scroll manually with a finger, but the user initiated scrolling is finished you want to start automatically scrolling with 2000 delay?

[ijero]

Could you please explain your requirements? So user can scroll manually with a finger, but the user initiated scrolling is finished you want to start automatically scrolling with 2000 delay?

Yes this is what i want.

[andkulikov]

Try this one

            val isDraggedState = pagerState.interactionSource.collectIsDraggedAsState()
            LaunchedEffect(isDraggedState) {
                snapshotFlow { isDraggedState.value }
                    .collectLatest { isDragged ->
                        if (!isDragged) {
                            while (true) {
                                delay(2000)
                                try {
                                    pagerState.animateScrollToPage(pagerState.currentPage + 1)
                                } catch (ignore: CancellationException) {
                                }
                            }
                        }
                    }
            }

[ijero]

Try this one

            val isDraggedState = pagerState.interactionSource.collectIsDraggedAsState()
            LaunchedEffect(isDraggedState) {
                snapshotFlow { isDraggedState.value }
                    .collectLatest { isDragged ->
                        if (!isDragged) {
                            while (true) {
                                delay(2000)
                                try {
                                    pagerState.animateScrollToPage(pagerState.currentPage + 1)
                                } catch (ignore: CancellationException) {
                                }
                            }
                        }
                    }
            }

Thank you very much, it works as I expected

[surensth]

Thanks for above solution. If incase anyone need to go to initial page, then this might help.

val isDraggedState = pagerState.interactionSource.collectIsDraggedAsState()
   LaunchedEffect(isDraggedState) {
       snapshotFlow { isDraggedState.value }
           .collectLatest { isDragged ->
               if (!isDragged) {
                   while (true) {
                       delay(2000)
                       try {
                           pagerState.animateScrollToPage(pagerState.currentPage + 1)
                           //If anyone need to go to initial page after last page
                           if (pagerState.currentPage == pagerState.pageCount - 1)
                               pagerState.animateScrollToPage(pagerState.initialPage)
                       } catch (ignore: CancellationException) {
                       }
                   }
               }
           }
   }