Question

我有一个如下所示的ViewPager：

当您滑动并仅保持中心视图的大小时，我需要ZoomOut侧面的预览，如下所示：

我已经用ViewPager.PageTransformer()尝试了一些示例，但是这些示例始终带有淡入淡出的动画（不需要），并且不显示预览（需要）。

Answer 1

    final int paddingPx = 300;
    final float MIN_SCALE = 0.8f;
    final float MAX_SCALE = 1f;

    viewPager.setClipToPadding(false);
    viewPager.setPadding(paddingPx, 0, paddingPx, 0);
    viewPager.setPageTransformer(false, transformer);

这使页面小于viewpager宽度：

这是我的变形金刚：

    PageTransformer transformer = new PageTransformer() {
        @Override
        public void transformPage(View page, float position) {
            float pagerWidthPx = ((ViewPager) page.getParent()).getWidth();
            float pageWidthPx = pagerWidthPx - 2 * paddingPx;

            float maxVisiblePages = pagerWidthPx / pageWidthPx;
            float center = maxVisiblePages / 2f;

            float scale;
            if (position + 0.5f < center - 0.5f || position > center) {
                scale = MIN_SCALE;
            } else {
                float coef;
                if (position + 0.5f < center) {
                    coef = (position + 1 - center) / 0.5f;
                } else {
                    coef = (center - position) / 0.5f;
                }
                scale = coef * (MAX_SCALE - MIN_SCALE) + MIN_SCALE;
            }
            page.setScaleX(scale);
            page.setScaleY(scale);
        }
    };

困难的是position方法的transformPage参数。当页面为填充viewpagers宽度时，此参数从0更改为1。但是，当页面较小时，此参数比较棘手。

position是视图左侧的值。当页面的左侧位于viewpager的左侧时，页面宽度等于1。position等于0。因此position可以大于1，具体取决于页面宽度。

首先，您需要找到Viewpagers中心（相对于position参数）。如果页面从中心向左移动或向右移动，则按比例缩小页面。在我的实现中，我将视图缩小到距中心一半的页面距离。

这是结果：

页面宽度可以通过padding进行控制。

可以通过viewPager.setPageMargin(value)方法添加页面之间的多余边距。

Android ViewPager ZoomOut动画

1 个答案: