How to disable pager animation of HorizontalPager in Jetpack Compose

Question

I create a page which has 4 tabs and subpages, the HorizontalPager with dragEnabled = false, then I want to disable the animation when I click the tabs for changing the pages. How can I do it?

Column(modifier = Modifier.padding(bottom = 0.dp)) {
    HorizontalPager(
        state = pagerState,
        flingBehavior = PagerDefaults.rememberPagerFlingConfig(pagerState),
        verticalAlignment = Alignment.CenterVertically,
        horizontalAlignment = Alignment.CenterHorizontally,
        dragEnabled = false,
        modifier = Modifier.fillMaxSize()
    ) { pagePosition ->
        when (pagePosition) {
            0 -> GuideScreen()
            1 -> WebViewScreen()
            2 -> WebViewScreen()
            3 -> MineScreen()
        }
    }

    TabRow(selectedTabIndex = pagerState.currentPage,
        modifier = Modifier.fillMaxWidth(),
        backgroundColor = Color.White,
        indicator = {},
        divider = {}) {
        //...
    }
}

I try to repeat the HorizontalPager by when(){} code, but the WebViewScreen(a webview page) reloads every time when the page was changed, so that is not a good way.

Answer 1

if you want to disable transition of each page during switching, instead of using

pagerState.animateScrollToPage(index)

just use the other one without animation

pagerState.scrollToPage(index)