最后一个项目滚动后水平寻呼机行为异常

Question

我使用的 pageSize 属性的固定宽度为 282.dp，但是当在最后一个项目之后滚动时，滚动需要一段时间才能返回到正常位置，如果发生另一个垂直滚动，它将卡在拉伸状态（由于滚动效果） )

我的寻呼机可组合

@Composable
fun DealsPager(
    deals: List<Deal>,
    rentalDuration: String,
    onClickDeal: (deal) -> Unit
) {
    val pagerState = rememberPagerState()

    HorizontalPager(
        pageCount = deals.size,
        state = pagerState,
        pageSize = PageSize.Fixed(282.dp), // here is the problem cause
        pageSpacing = 16.dp,
        contentPadding = PaddingValues(horizontal = 16.dp)
    ) {
        DealItem(
            deal = deals[it],
            duration = rentalDuration,
            testTag = "deal list item $it",
            onClick = onClickDeal
        )
    }
}

如果我尝试删除 pageSize 工作正常，我需要一种方法，使其能够在项目的固定大小下正常工作，以便每页显示多个项目

Answer 1

使用列设置固定大小

Column(Modifier.width(282.dp)) {
    HorizontalPager(
      ...
    ) {
       ...
    }
}

Answer 2

我发现是HorizontalPagerApi的pageSize属性错误。我找到了一些你可以使用的解决方法。

 HorizontalPager(
                        verticalAlignment = Alignment.Top,
                        beyondBoundsPageCount = 1,
                        state = pagerState
                    ) { idx ->
                        Box(modifier = Modifier
                            .width(boxWidthDp.dp)
                            .graphicsLayer {
                                val yourValue = calculateValue(idx) 
                                when (idx) {
                                    0 -> {
                                        translationX = yourValue
                                    }

                                    1 -> {
                                        translationX = yourValue
                                    }

                                    2 -> {
                                        translationX = yourValue
                                    }
                                }
                            }
                        ){...}

想法是您可以将内容向左和向右移动，以便它也出现在其他屏幕上。您当然必须调整代码并添加自己的

calculateValue(...)

方法。