Android之基于viewPager画廊实现

效果图：

思路实现：用viewPager和设置PageTransformer,viewPager可以设置setPagerTransformer属性，这个属性是改变页面滑动时的效果，例如：缩放和透明。需要自己实现PagerTransformer接口，就要重写transformPage方法，这个方法有两个参数，一个是view，一个是view的position.其实用过viewpager的都知道一般会显示三页。具体看下面的图：

当我们左滑或者右滑的时候：

这时候我们就可以设置view的缩放:

public class MyTransformation implements ViewPager.PageTransformer {
    /**
     * 通过position 知道view是在-1，0，1 然后 setScalex和setScaleY来设置page的缩放
     *
     */
    private static final float MIN_SCALE=0.85f;//缩放大小
    private static final float MIN_ALPHA=0.5f;
    private static final float MAX_ROTATE=30;
    private Camera camera=new Camera();
    @Override
    public void transformPage(View page, float position) {
        float scaleFactor=Math.max(MIN_SCALE,1-Math.abs(position));//取缩放的值
        if (position<-1){

        }else if (position<0){//最右的时候是缩
            page.setScaleX(scaleFactor);
            page.setScaleY(scaleFactor);
            page.setRotationY(0);//垂直旋转度数为0
        }else if (position>=0&&position<1){//当前页不变化
            page.setScaleX(scaleFactor);
            page.setScaleY(scaleFactor);
            page.setRotationY(0);
        }
        else if (position>=1) {//最左的时候是缩
            page.setScaleX(scaleFactor);
            page.setScaleY(scaleFactor);
            page.setRotationY(0);
        }
    }
}

然后给viewPager设置相应的PagerTransformer：

viewPager.setPageTransformer(true,new MyTransformation());

其中布局文件：

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipChildren="false"
    android:layerType="software"
    tools:context="com.example.evanzeng.viewpagertest.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        />
    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="wrap_content"
        android:layout_height="400dp"
        android:layout_gravity="center"
        android:clipChildren="false"
        >
    </android.support.v4.view.ViewPager>
</LinearLayout>

最重要的是：父布局和viewPager设置android:clipChildern="false",然后在代码设置宽度，使其没有充满整个屏幕。Activity代码：

 viewPager.setOffscreenPageLimit(3);
        pagerWidth= (int) (getResources().getDisplayMetrics().widthPixels*3.0f/5.0f);
        ViewGroup.LayoutParams lp=viewPager.getLayoutParams();
        if (lp==null){
            lp=new ViewGroup.LayoutParams(pagerWidth, ViewGroup.LayoutParams.MATCH_PARENT);
        }else {
            lp.width=pagerWidth;
        }
        viewPager.setLayoutParams(lp);

这样就实现了。

项目demo:点击打开链接