這里說的是ViewPager在頁面切換的時候更改Item的樣式:縮放、位置變化等等瓶蝴;本文羅列三種情況毒返,具體如下:
1. 所有Item重疊,滑動時透明度變化舷手,X饿悬、Y拉伸
代碼如下:
public class PageTransformerOne implements ViewPager.PageTransformer {
private static float MIN_SCALE = 0.75f;
@SuppressLint("NewApi")
@Override
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
if (position < -1) {
view.setAlpha(0);
} else if (position <= 0) {
view.setAlpha(1);
view.setTranslationX(0);
view.setScaleX(1);
view.setScaleY(1);
} else if (position <= 1) {
view.setAlpha(1 - position);
view.setTranslationX(pageWidth * -position);
float scaleFactor = MIN_SCALE + (1 - MIN_SCALE)
* (1 - Math.abs(position));
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
} else {
view.setAlpha(0);
}
}
}
運行效果:
2. 所有Item橫向排列,滑動時透明度變化聚霜,X狡恬、Y拉伸
代碼如下:
public class PageTransformerTwo implements ViewPager.PageTransformer {
private static float MIN_SCALE = 0.85f;
private static float MIN_ALPHA = 0.5f;
@Override
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
int pageHeight = view.getHeight();
if (position < -1) {
view.setAlpha(0);
} else if (position <= 1) {
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);
}
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
view.setAlpha(MIN_ALPHA + (scaleFactor - MIN_SCALE)
/ (1 - MIN_SCALE) * (1 - MIN_ALPHA));
} else {
view.setAlpha(0);
}
}
}
滑動效果:
3. (類似于畫廊的效果)所有Item橫向排列,滑動時透明度變化蝎宇,X弟劲、Y拉伸
public class PageTransformerThree implements ViewPager.PageTransformer {
private float MIN_SCALE = 0.5f;
@SuppressLint("NewApi")
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
Log.d("123",position+" viewpager");
if (position < -1) {
position = -1;
} else if (position > 1) {
position = 1;
}
view.setTranslationX(0);
float scaleFactor = MIN_SCALE + (1 - MIN_SCALE)
* (1 - Math.abs(position));
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT) {
view.getParent().requestLayout();
}
}
}
滑動效果,也可以在屏幕上同時顯示多個: