android viewpager画廊,Android使用ViewPager实现画廊效果

按照国际惯例，先上效果图

其实这跟普通的ViewPager原理都一样，需要改变的地方就是：

1.增加滑进和滑出的动画效果

2.缩小ViewPager的大小，给屏幕上留出上一张和下一张视图的空间

布局文件：

xmlns:android="http://schemas.android.com/apk/res/android"

android:clipChildren="false"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/shareImg"

android:layout_width="match_parent"

android:layout_marginHorizontal="60dp"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:clipChildren="false"

android:layout_above="@+id/shareOptions"

/>

这里只贴出了需要用到的部分

注意viewpager自身和父布局都需要加上 android:clipChildren="false" 属性

网上大神解释为：在子View进行绘制时不裁切它们的显示范围

接下来是动画部分：

这里需要写个继承自ViewPager.PageTransformer的类，并重写transformPage方法

public class ScaleAlphaPageTransformerimplements ViewPager.PageTransformer{

public static final float MAX_SCALE =1.0f;

public static final float MIN_SCALE =0.8f;

public static final float MAX_ALPHA =1.0f;

public static final float MIN_ALPHA =0.7f;

private boolean alpha =true;

private boolean scale =true;

@Override

public void transformPage(View page,float position) {

if (position < -1) {

position = -1;

}else if (position >1) {

position =1;

}

float tempScale = position <0 ?1 + position :1 - position;

if(scale){

float slope = (MAX_SCALE -MIN_SCALE) /1;

//一个公式

float scaleValue =MIN_SCALE + tempScale * slope;

page.setScaleX(scaleValue);

page.setScaleY(scaleValue);

}

if(alpha){

//模糊

float alope = (MAX_ALPHA -MIN_ALPHA) /1;

float alphaValue =MIN_ALPHA + tempScale * alope;

page.setAlpha(alphaValue);

}

}

/***

* 设置是否模糊和改变大小

* @param alpha

* @param scale

*/

public void setType(boolean alpha,boolean scale){

this.alpha = alpha;

this.scale = scale;

}

}

最后就是调用了

ScaleAlphaPageTransformer scaleAlphaPageTransformer =new ScaleAlphaPageTransformer();

scaleAlphaPageTransformer.setType(true,true);

viewPager.setPageTransformer(true,scaleAlphaPageTransformer);

viewPager.setPageMargin(2);

viewPager.setOffscreenPageLimit(3);

ShareImgAdapter shareImgAdapter =new ShareImgAdapter(listOfImg);

viewPager.setAdapter(shareImgAdapter);

完成