Android ViewPager2 setPageMargin 未解决

Question

我想使用View Pager2左右页面的预览来实现 Carousel ，如下所示：

最初我使用的是支持的视图 pager1。现在我认为它被删除了

    viewPagerhost.setPageMargin(20);

知道我们如何使用 View Pager 2 实现这一点

Answer 1

MarginPageTransformer 无法满足您的需求。

您必须使用自定义setPageTrarnsformer。

第1步

这是我的扩展方法。

您可以在这篇文章中查看详细信息 中文章

fun ViewPager2.setShowSideItems(pageMarginPx : Int, offsetPx : Int) {

    clipToPadding = false
    clipChildren = false
    offscreenPageLimit = 3

    setPageTransformer { page, position ->

        val offset = position * -(2 * offsetPx + pageMarginPx)
        if (this.orientation == ViewPager2.ORIENTATION_HORIZONTAL) {
            if (ViewCompat.getLayoutDirection(this) == ViewCompat.LAYOUT_DIRECTION_RTL) {
                page.translationX = -offset
            } else {
                page.translationX = offset
            }
        } else {
            page.translationY = offset
        }
    }

}

第2步

根据您的用例设置 pageMarginPx 和 offsetPx。

<resources>
    <dimen name="pageMargin">20dp</dimen>
    <dimen name="pagerOffset">30dp</dimen>
    <dimen name="pageMarginAndoffset">50dp</dimen>
</resources>

第 3 步

在 xml 中设置布局项的侧边距。

像这样

fun ViewPager2.setShowSideItems(pageMarginPx : Int, offsetPx : Int) {

    clipToPadding = false
    clipChildren = false
    offscreenPageLimit = 3

    setPageTransformer { page, position ->

        val offset = position * -(2 * offsetPx + pageMarginPx)
        if (this.orientation == ViewPager2.ORIENTATION_HORIZONTAL) {
            if (ViewCompat.getLayoutDirection(this) == ViewCompat.LAYOUT_DIRECTION_RTL) {
                page.translationX = -offset
            } else {
                page.translationX = offset
            }
        } else {
            page.translationY = offset
        }
    }

}

Answer 2

现在我们需要setPageTransformer()在Version 1.0.0-alpha05

新功能

• ItemDecorator 引入了与 RecyclerView 一致的行为。
• MarginPageTransformer 引入以提供在页面之间（页面插图之外）创建空间的能力。
• CompositePageTransformer 引入以提供组合多个 PageTransformer 的能力。

示例代码

myViewPager2.setPageTransformer(new MarginPageTransformer(1500));

如果您想使用 View Pager2 实现 Carousel，请查看我之前的回答