ViewPager
滑动页面动画的示例,该示例涉及将页面(View
)翻译到一定量。该示例来自文档。具体而言,它是关于一个名为 ZoomOutPageTransformer
的实现,可以通过 setPageTransformer()
设置在 ViewPager
上以自定义页面滑动(引入 缩放 动画)的方式。这就是最终结果应该是什么样子的:
![enter image description here](https://istack.dev59.com/wY0Dj.gif)
这是他们所提供的在实现
transformPage()
时,您可以通过确定屏幕上的页面位置(从transformPage()
方法的position
参数获取),以此来创建自定义的幻灯片动画。
position
参数指示给定页面相对于屏幕中心的位置。它是一个动态属性,随着用户滚动页面而更改。当页面填充整个屏幕时,其position
值为 0。当页面刚好绘制在屏幕右侧时,其position
值为 1. 如果用户在第一页和第二页之间滚动了一半,则第一页的position
值为 -0.5,而第二页的position
值为 0.5。根据屏幕上页面的位置,您可以通过使用诸如setAlpha()
、setTranslationX()
或setScaleY()
等方法来设置页面属性,从而创建自定义的幻灯片动画。
PageTransformer
实现:public class ZoomOutPageTransformer implements ViewPager.PageTransformer {
private static final float MIN_SCALE = 0.85f;
private static final float MIN_ALPHA = 0.5f;
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
int pageHeight = view.getHeight();
if (position < -1) { // [-Infinity,-1)
// This page is way off-screen to the left.
view.setAlpha(0);
} else if (position <= 1) { // [-1,1]
// Modify the default slide transition to shrink the page as well
float scaleFactor = Math.max(MIN_SCALE, 1 - Math.abs(position));
float vertMargin = pageHeight * (1 - scaleFactor) / 2;
float horzMargin = pageWidth * (1 - scaleFactor) / 2;
if (position < 0) {
view.setTranslationX(horzMargin - vertMargin / 2);
} else {
view.setTranslationX(-horzMargin + vertMargin / 2);
}
// Scale the page down (between MIN_SCALE and 1)
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
// Fade the page relative to its size.
view.setAlpha(MIN_ALPHA +
(scaleFactor - MIN_SCALE) /
(1 - MIN_SCALE) * (1 - MIN_ALPHA));
} else { // (1,+Infinity]
// This page is way off-screen to the right.
view.setAlpha(0);
}
}
}
问题:
我不理解这个陈述的含义,
view.setTranslationX(horzMargin - vertMargin / 2);
我的理解是,position
参数的值为1.0相当于覆盖屏幕宽度,即w。因此,如果页面中心移动了x个position
单位,则以像素/ dp为单位的平移量将为w * x。但他们使用了一些边距计算来计算平移量。
有人能解释一下他们如何进行此计算以及我的计算有什么问题吗?