android Viewpager PageTransformer 筆記

viewpager 滑動切換頁面的時候可以實現各種有趣的效果主要通過ViewPager.PageTransformer這個類來實現

例如:

public class MyPagerTransFormer implements ViewPager.PageTransformer {

    @Override
    public void transformPage(View page, float position) {

        if (position == 0){
            page.setAlpha(1);
        }else if (position < 0){
            page.setAlpha( 1 - Math.abs(position));
            page.setPivotX(page.getMeasuredWidth() / 2);
            page.setPivotY(page.getMeasuredHeight());
            page.setRotation(20 * position);
        }else if (position > 0){
            page.setAlpha(1 - Math.abs(position));
            page.setPivotX(page.getMeasuredWidth() / 2);
            page.setPivotY(page.getMeasuredHeight());
            page.setRotation(20 * position);
        }

    }
}

其中 transformPage 這個方法有兩個參數, 第一個表示當前的頁面, 第二個表示切換的時候一個進度值

當position = 0 的時候表示在當前頁面也就是停在的這個頁面

當我們從頁面向左滑動到B頁面的時候

這個時候A 從0到-1 B 從 1 到 0 

我們可以通過 page.getMeasuredWidth() 和 page.getMeasuredHeight()來獲取寬高做響應的變換

 

擴展:

我們有時候可以看到viewpager在頁面上面顯示一個半的這種效果

1.首先需要在viewpager 上面都加上 android:clipChildren="false" .

2.網上有資料說setClipChildren(false)在3.0以上版本中，開啓了硬件加速後將不能正常工作，所以需要將其設置爲軟件加速。設置軟硬件加速使用 setLayerType(View.LAYER_TYPE_SOFTWARE, null); 也可以在佈局文件中添加 android:layerType=”software” (這個方法還沒有實際去嘗試過)

3.還有網上有些說要加 android:layout_marginRight 和 android:layout_marginLeft 這兩個屬性,這兩個我嘗試了過後兩邊留很大空白實際沒有達到效果,重要的還是要重寫pagerAdapter裏面的

@Override
public float getPageWidth(int position) {
    return (float) 0.8;
}

這個方法,返回值表示顯示的比例;

但是這種方法加載到最後一頁的時候 postion 的值並不能達到臨界值,所以感覺不是很可取

4.記得設置setOffscreenPageLimit(3); 不然切換的時候頁面顯示會很突兀

5.設置setPageMargin控制兩個頁面之間的間隙