推荐一个比较好用的画廊展示图片（支持无限轮播）的控件ViewPagerGallery

1.在此我们引用支持无限滑动的3D视觉的画廊效果、平面普通广告栏轮播

这个例子中有可以运行的效果，大家可以下载下来先看一下，在我开始使用的时候，发现，想要调整 page item中的间距，比较困难，并没有暴露方法出来。所以就要看一下源代码，发现，在不使用3D效果，即初始化：initBanner(urlList,false)，没有什么问题，（这里说的3D效果，就是左右item要比正在显示的item的高度小一些，并且添加动画的效果）

banner_3d.initBanner(urlList, true)//开启3D画廊效果.addPageMargin(5, 15)//参数1page之间的间距,参数2中间item距离边界的间距.addPoint(6)//添加指示器.addPointBottom(7).addStartTimer(5)//自动轮播5秒间隔.addRoundCorners(12)//圆角.finishConfig()//这句必须加.addBannerListener(new BannerViewPager.OnClickBannerListener() {@Overridepublic void onBannerClick(int position) {//点击itemshowShort("效果1点击"+position);Log.i("test","--------------00x1");}});

2.发现开启3D效果时，addPageMargin会失效，item左右的间距设置没有任何改变，页面非常丑陋，左右间距相差太大，罪魁祸首是 ZoomPageTransformer这个类

然后我们可以通过修改 setScaleX，setScaleY来分别改变page item间距以及左右item的高度问题，以下我修改了原来的view.setScaleX(MIN_SCALE);为 view.setScaleY(X_SCALE);

package com.lzj.gallery.library.transformer;import android.support.v4.view.ViewPager;
import android.util.Log;
import android.view.View;/*** Created by Administrator on 2018/11/28.* 3D画廊效果其实就是ViewPager的item切换时，进行缩放的动画效果**/public class ZoomPageTransformer implements ViewPager.PageTransformer {private static final float MAX_SCALE = 1.0f;//0缩放//    private static final float MIN_SCALE = 0.85f;//0.85缩放private static final float MIN_SCALE = 0.89f;//0.85缩放private static final float X_SCALE = 0.99f;private float MIN_ALPHA = 1.0f;//最小透明度public ZoomPageTransformer() {}public ZoomPageTransformer(float MIN_ALPHA) {this.MIN_ALPHA = MIN_ALPHA;}@Overridepublic void transformPage(View view, float position) {//setScaleY只支持api11以上/*** (-oo,-1) 相对于左边第一页，其左边的所有页面 *** x、y拉伸为MIN_SCALE、透明度MIN_ALPHA*/if (position < -1) {Log.d("MyInfo","11111");
//            view.setScaleX(MIN_SCALE);view.setScaleX(X_SCALE);view.setScaleY(MIN_SCALE);view.setAlpha(MIN_ALPHA);}/*** [-1, 1 )当前页的左右第一页*/else if (position < 1) {Log.d("MyInfo","2222");float scaleFactor = MIN_SCALE + (1 - Math.abs(position)) * (MAX_SCALE - MIN_SCALE);//[0, 1 ） 相对于当前选中页，其右边第一页 **if (position > 0) {Log.d("MyInfo","3333");view.setTranslationX(-scaleFactor);}// [-1, 0 ) 相对于当前选中页，其左边的第一页**else if (position < 0) {Log.d("MyInfo","4444");view.setTranslationX(scaleFactor);}view.setScaleY(scaleFactor);
//            view.setScaleX(scaleFactor);view.setScaleX(X_SCALE);// float alpha = 1f -  Math.abs(position) * (1 - );float alpha = MIN_ALPHA + (1 - MIN_ALPHA) * (1 - Math.abs(position));view.setAlpha(alpha);}/*** [1,+oo） 相对于右边第一页，其右边的所有页面* x、y拉伸为MIN_SCALE、透明度MIN_ALPHA*/else { // (1,+Infinity]Log.d("MyInfo","5555");
//            view.setScaleX(MIN_SCALE);view.setScaleX(X_SCALE);view.setScaleY(MIN_SCALE);view.setAlpha(MIN_ALPHA);}}}

3.重要方法

view.setScaleX(X_SCALE);
view.setScaleY(MIN_SCALE);

4.如何使用

4.1xml中声明：

<com.lzj.gallery.library.views.BannerViewPagerandroid:id="@+id/banner_3d"android:layout_marginTop="20dp"android:clipChildren="false"android:layout_width="match_parent"android:layout_height="150dp"></com.lzj.gallery.library.views.BannerViewPager>

4.2 activity中调用

banner_3d.initBanner(urlList, true)//开启3D画廊效果.addPageMargin(5, 15)//参数1page之间的间距,参数2中间item距离边界的间距.addPoint(6)//添加指示器.addPointBottom(7).addStartTimer(5)//自动轮播5秒间隔.addRoundCorners(12)//圆角.finishConfig()//这句必须加.addBannerListener(new BannerViewPager.OnClickBannerListener() {@Overridepublic void onBannerClick(int position) {//点击itemshowShort("效果1点击"+position);Log.i("test","--------------00x1");}});

4.3 优化处理（页面中控制 banner轮播开始与暂停）

@Overridepublic void onStart() {super.onStart();if(mBanner!=null){mBanner.startTimer();}}@Overridepublic void onStop() {super.onStop();if(mBanner!=null){mBanner.stopTimer();}}

注意：（如果在RecyclerView中使用的时候，要先进行 mBanner.removeAllView（），否则会有图案粘贴在背后的一个bug）

由于上面贴出的那个类还在类库文件中，可以将源代码下载下来并且将 gallery类库直接导进来，修改ZoomPageTransformer即可。下面贴一张改后的效果图(第一个显示为改后的效果)：

推荐一个比较好用的画廊展示图片（支持无限轮播）的控件ViewPagerGallery

推荐一个比较好用的画廊展示图片（支持无限轮播）的控件ViewPagerGallery相关推荐

最新文章

热门文章