HorizontalPager 忽略 itemSpacing 并覆盖 Jetpack Compose 中的内容答案

【问题标题】：HorizontalPager is ignoring itemSpacing and overriding content in Jetpack ComposeHorizontalPager 忽略 itemSpacing 并覆盖 Jetpack Compose 中的内容
【发布时间】：2022-11-28 19:28:57
【问题描述】：

我有一个带有 currentPage 焦点效果的 HorizontalPager（来自 Accompanist）。在模拟器上，它可以正常工作，并且具有我想要的正确间距，但是，在智能手机上，它不遵守 itemSpacing 并完全忽略它，与右侧的寻呼机项目重叠。有没有办法让这个寻呼机始终具有相同的间距，而不管设备如何？或者，至少，右边的项目不重叠并且主要项目与其他两个项目重叠？

下面是正在发生的事情和我想要的行为的一些屏幕截图：

正确的行为（在模拟器上工作）：

错误行为和问题（在物理设备上工作）：

代码：

 HorizontalPager(
        state = state,
        count = items.count(),
        contentPadding = PaddingValues(horizontal = 72.dp),
        itemSpacing = 10.dp,
        modifier = modifier.padding(top = 16.dp)
    ) { page ->
        Card(
            shape = RectangleShape,
            modifier = Modifier
                .graphicsLayer {
                    // Calculate the absolute offset for the current page from the
                    // scroll position. We use the absolute value which allows us to mirror
                    // any effects for both directions
                    val pageOffset = calculateCurrentOffsetForPage(page).absoluteValue

                    // We animate the scaleX + scaleY, between 85% and 100%
                    lerp(
                        start = 0.85f,
                        stop = 1f,
                        fraction = 1f - pageOffset.coerceIn(0f, 1f)
                    ).also { scale ->
                        scaleX = scale
                        scaleY = scale
                    }

                    // We animate the alpha, between 50% and 100%
                    alpha = lerp(
                        start = 0.6f,
                        stop = 1f,
                        fraction = 1f - pageOffset.coerceIn(0f, 1f)
                    )
                }
                .requiredWidth(284.dp)
                .requiredHeight(168.dp)
                //.coloredShadow(Shadow, 0.28f)
        ) {
            // content
        }
    }

可以提供任何其他必要的代码，请告诉我。

【问题讨论】：

标签： android android-jetpack-compose pager

【解决方案1】：

您应该使用 how to support different screen sizes in android with jetpack compose，您可以在其中为不同的配置定义尺寸。同上可以参考这个教程

https://proandroiddev.com/supporting-different-screen-sizes-on-android-with-jetpack-compose-f215c13081bd

【讨论】：