日常开发中经常会有如下需求:
ViewPager 左右突出,实现起来非常简单:
1 | <android.support.v4.view.ViewPager |
添加 padding、clipToPadding 即可。
现在还有几个需求:
- 两边的 item 小一点,并且有透明度
- item 之间的间距固定
- 滑动有动画效果
第 1点使用 scale 进行缩放即可,但是左边需要向右缩放,右边需要向左缩放,才能保证第 2 点。
第 2 点使用 setPageMargin。
第 3 点使用 setPageTransformer。
transformPage 有 2 个参数:
- page,View: Apply the transformation to this page
- position,float: Position of page relative to the current front-and-center position of the pager. 0 is front and center. 1 is one full page position to the right, and -1 is one page position to the left.
也就是左边的 View -10 变化,右边的 View 01 变化。
下面问题来了,显示的页面并非在中间的时候缩放到最大,而是要滑动到左边的边缘才是最大。通过断点调试,发现 postion 值就没有出现过0,也就是从来没有滑到“正中间”。看到代码调用 transformPage 的地方:
1 | protected void onPageScrolled(int position, float offset, int offsetPixels) { |
传回来的 transformPos 在进行计算时,没有考虑 ViewPager 的 padding,一切似乎都对应上了。
自己计算位置,最终代码:
1 | viewPager.pageMargin = DimenUtils.dp2px(10f) |
注:scale 动画可以设置 x、y 的参照点,代码设置为相对值,不是百分比,所以需要根据百分比映射到真实的位置。