Banner 3D效果 左右有缩小的图片边缘 中间图正常(旋转木马/缩放轮播图效果)
动画类
import android.support.v4.view.ViewPager;
import android.view.View;
public class TransformerZoomGallery implements ViewPager.PageTransformer {
private static final float MAX_SCALE = 1.0f;//0缩放
private static final float MIN_SCALE = 0.85f;//0.85缩放
private float MIN_ALPHA = 1.0f;//最小透明度
public TransformerZoomGallery () {
}
public TransformerZoomGallery (float MIN_ALPHA) {
this.MIN_ALPHA = MIN_ALPHA;
}
@Override
public void transformPage(View view, float position) {
//setScaleY只支持api11以上
/**
* (-oo,-1) 相对于左边第一页，其左边的所有页面 **
* x、y拉伸为MIN_SCALE、透明度MIN_ALPHA
*/
if (position < -1) {
view.setScaleX(MIN_SCALE);
view.setScaleY(MIN_SCALE);
view.setAlpha(MIN_ALPHA);
}
/**
* [-1, 1 )当前页的左右第一页
*/
else if (position < 1) {
float scaleFactor = MIN_SCALE + (1 - Math.abs(position)) * (MAX_SCALE - MIN_SCALE);
//[0, 1 ） 相对于当前选中页，其右边第一页 **
if (position > 0) {
view.setTranslationX(-scaleFactor);
}
// [-1, 0 ) 相对于当前选中页，其左边的第一页**
else if (position < 0) {
view.setTranslationX(scaleFactor);
}
view.setScaleY(scaleFactor);
view.setScaleX(scaleFactor);
// 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]
view.setScaleX(MIN_SCALE);
view.setScaleY(MIN_SCALE);
view.setAlpha(MIN_ALPHA);
}
}
}重写ViewPager
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Context;
import android.os.Handler;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import java.util.List;
import com.lake.banner.R;
public class BannerViewPager extends RelativeLayout implements ViewPager.OnPageChangeListener{
private View mLayout;//布局
private Activity mContext;//上下文
private ViewPager mViewPager;//viewpager
private BannerPagerAdapter mPagerAdapter;//adapter
private LinearLayout mLineIndicator;//指示器集合容器
private ImageView[] mImageView;//小圆点imageview对象
private List mList;//url数组
private int mMaxNumber;//最大banner数
private int currentIndex = 0;//当前实际page
private int startCurrentIndex = 2000;//当前page
private long secondTime=0,firstTime=0;
private boolean isSlide = false;
private Handler mHandler = null;
private AutoRollRunnable mAutoRollRunnable = null;
private int mRollTime=5000;
private boolean isPoint=false;//开启指示器
public static interface OnClickBannerListener {
void onBannerClick(int position);
}
private OnClickBannerListener mBannerListener;
public BannerViewPager addBannerListener(OnClickBannerListener listener) {
mBannerListener = listener;
return this;
}
public BannerViewPager(Context context) {
super(context);
}
public BannerViewPager(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public BannerViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
this.mContext = (Activity) context;
}
/**
* 初始化viewpager
* @param list url集合
* @param isGallery 是否使用3D画廊效果
*/
public BannerViewPager initBanner(List list,boolean isGallery){
checkException(list);
if(mList==null){
mList=list;
if(list.size()>9){
mMaxNumber=9;
} else {
mMaxNumber=list.size();
}
}
//引入布局
mLayout = LayoutInflater.from(mContext).inflate( R.layout.banner_view_layout, null);
mViewPager = (ViewPager) mLayout.findViewById(R.id.viewPager);//关闭
mLineIndicator = (LinearLayout) mLayout.findViewById(R.id.lineIndicator);
//初始化位置
currentIndex=startCurrentIndex%mMaxNumber;
mPagerAdapter = new BannerPagerAdapter(mList,mContext);
mPagerAdapter.setOnClickImagesListener(new BannerPagerAdapter.OnClickImagesListener() {
@Override
public void onImagesClick(int position) {
if(mBannerListener!=null){
mBannerListener.onBannerClick(position);
}
}
});
mViewPager.setAdapter(mPagerAdapter);
if(isGallery){
mViewPager.setPageTransformer(true,new ZoomPageTransformerGallery());
}
mViewPager.setCurrentItem(startCurrentIndex);
mViewPager.setOffscreenPageLimit(2);//设置预加载的数量，这里设置了2,会预加载中心item左边两个Item和右边两个Item
mViewPager.addOnPageChangeListener(this);
return this;
}
/**
* 初始化viewpager
* @param list url集合
* @param isGallery 是否使用3D画廊效果
* @param alpha 滑动透明度变化
*/
public BannerViewPager initBanner(List list,boolean isGallery,float alpha){
checkException(list);
if(mList==null){
mList=list;
if(list.size()>9){
this.mMaxNumber=9;
} else {
this.mMaxNumber=list.size();
}
}
//引入布局
mLayout = LayoutInflater.from(mContext).inflate( R.layout.banner_view_layout, null);
mViewPager = (ViewPager) mLayout.findViewById(R.id.viewPager);//关闭
mLineIndicator = (LinearLayout) mLayout.findViewById(R.id.lineIndicator);
//初始化位置
currentIndex=startCurrentIndex%mMaxNumber;
mPagerAdapter = new BannerPagerAdapter(mList,mContext);
mPagerAdapter.setOnClickImagesListener(new BannerPagerAdapter.OnClickImagesListener() {
@Override
public void onImagesClick(int position) {
if(mBannerListener!=null){
mBannerListener.onBannerClick(position);
}
}
});
mViewPager.setAdapter(mPagerAdapter);
if(isGallery){
mViewPager.setPageTransformer(true,new ZoomPageTransformerGallery(alpha));
}
mViewPager.setCurrentItem(startCurrentIndex);
mViewPager.setOffscreenPageLimit(2);//设置预加载的数量，这里设置了2,会预加载中心item左边两个Item和右边两个Item
mViewPager.addOnPageChangeListener(this);
return this;
}
/**
* 添加默认图片,当加载失败后显示
* @param resId_img
* @return
*/
public BannerViewPager addDefaultImg(int resId_img){
mPagerAdapter.setDefaultImg(resId_img);
return this;
}
/**
* 添加圆角
* @param corners
* @return
*/
public BannerViewPager addRoundCorners(int corners){
mPagerAdapter.setmRoundCorners(corners);
return this;
}
/**
*
* @param columnMargin 两个Page之间的距离
* @param rowMargin page的外边距
* 注意当添加了3D画廊效果时,columnMargin尽量设小。应该本是已经进行了x、y的缩放
*/
public BannerViewPager addPageMargin(int columnMargin,int rowMargin) {
mViewPager.setPageMargin(dip2px(columnMargin));
RelativeLayout.LayoutParams layout = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
layout.setMargins(dip2px(rowMargin), 0, dip2px(rowMargin), 0);
mViewPager.setLayoutParams(layout);
return this;
}
/**
* 添加小圆点
* @param distance 间距
*/
public BannerViewPager addPointMargin(int distance) {
isPoint=true;
mImageView = new ImageView[mMaxNumber];
for (int i = 0; i < mMaxNumber; i++) {
ImageView imageView=new ImageView(mContext);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(dip2px(distance)/2, 0, dip2px(distance)/2, 0);
imageView.setLayoutParams(params);
if(i==currentIndex){
// imageView.setImageResource(?);
}
else {
// imageView.setImageResource(?);
}
mImageView[i]=imageView;
mLineIndicator.addView(imageView);
}
return this;
}
/**
* 添加小圆点
* @param distance 间距
* @param piont_press 替换选中图标
* @param piont 替换未选中图片
*/
public BannerViewPager addPoint(int distance,int piont_press,int piont) {
isPoint=true;
// resId_piont_press=piont_press;
// resId_piont=piont;
mImageView = new ImageView[mMaxNumber];
for (int i = 0; i < mMaxNumber; i++) {
ImageView imageView=new ImageView(mContext);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(dip2px(distance)/2, 0, dip2px(distance)/2, 0);
imageView.setLayoutParams(params);
if(i==currentIndex){
// imageView.setImageResource(？);
}
else {
// imageView.setImageResource(？);
}
mImageView[i]=imageView;
mLineIndicator.addView(imageView);
}
return this;
}
/**
* 添加小圆点底部间距
* @param paddBottom
*/
public BannerViewPager addPointBottom(int paddBottom){
mLineIndicator.setPadding(0,0,0,dip2px(paddBottom));
return this;
}
/**
* 配置完成,将布局添加到父容器
*/
public BannerViewPager finishConfig(){
this.addView(mLayout);
return this;
}
//开始轮播
public BannerViewPager addStartTimer(int time) {
mRollTime=time;
if(mHandler==null){
mHandler = new Handler();
}
if(mAutoRollRunnable==null){
mAutoRollRunnable = new AutoRollRunnable();
}
mAutoRollRunnable.start();
return this;
}
// 停止轮播
public void stopTimer() {
if(mAutoRollRunnable!=null){
mAutoRollRunnable.stop();
}
}
private class AutoRollRunnable implements Runnable {
//是否在轮播的标志
boolean isRunning = false;
@SuppressLint("ClickableViewAccessibility")
@Override
public void run() {
if (isRunning && !isSlide) {
int index = mViewPager.getCurrentItem()+1;//下一个页
mViewPager.setCurrentItem(index);//设置此次要显示的pager
currentIndex=index%mMaxNumber;
setImageBackground(currentIndex);
mHandler.postDelayed(this, 1000*mRollTime);
}
if (isSlide){
mHandler.postDelayed(this,1000*mRollTime);
isSlide = false;
}
//轮播图触摸监听，解决滑动计时无法停止的问题
/*
* viewPager监听触摸事件，因为我们要保证用户在手动滑动viewPager后，系统重新计时，viewPage按一定时间间隔循环展示，
* 当手指按上屏幕或者是手指出现滑动动作，子线程都必须撤销（计时也就是消失）
* 当手机松开之后系统重新计时，子线程与UI线程绑定，进行计时操作
*/
mViewPager.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()){
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
mHandler.removeCallbacks(mAutoRollRunnable);
break;
case MotionEvent.ACTION_UP:
isSlide = true;
mHandler.post(mAutoRollRunnable);
break;
}
return false;
}
});
}
public void start() {
if (!isRunning) {
isRunning = true;
mHandler.removeCallbacks(this);
mHandler.postDelayed(this, 1000*mRollTime);
}
}
public void stop() {
if (isRunning) {
mHandler.removeCallbacks(this);
isRunning = false;
}
}
}
/**
* 根据手机的分辨率从 dp 的单位 转成为 px(像素)
*/
public int dip2px(float dpValue) {
final float scale = mContext.getResources().getDisplayMetrics().density;
return (int) (dpValue * scale + 0.5f);
}
//---------------viewpager滑动事件-----------------
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
/**
* 滑动时同步改变底部小圆点
* @param position
*/
@Override
public void onPageSelected(int position) {
currentIndex=position % mMaxNumber;
setImageBackground(currentIndex);
}
/**
* 改变指示器
* @param selectItemsIndex
*/
private void setImageBackground(int selectItemsIndex) {
if(isPoint){
for (int i = 0; i < mImageView.length; i++) {
if (i == selectItemsIndex) {
// mImageView[i].setImageResource(?);
} else {
// mImageView[i].setImageResource(?);
}
}
}
}
/**
* 检查异常
* @param list
*/
private void checkException(List list){
if(list==null){
throw new NullPointerException("The array is null at initBanner function");
}
if(list.size()==0){
throw new ArithmeticException("Your array size is 0");
}
}
} 适配器
import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import com.bumptech.glide.Glide;
import com.bumptech.glide.load.engine.DiskCacheStrategy;
import com.bumptech.glide.load.resource.bitmap.RoundedCorners;
import com.lake.banner.R;
import java.util.List;
public class BannerPagerAdapter extends PagerAdapter {
private List mList;
private Context mContext;
private int defaultImg = R.mipmap.ic_banner_error;//默认图片
private int mRoundCorners = -1;
private int mMaxNumber;//最大banner数
/**
* 默认
*
* @param defaultImg
*/
public void setDefaultImg(int defaultImg) {
this.defaultImg = defaultImg;
}
/**
* 设置圆角
*
* @param mRoundCorners
*/
public void setmRoundCorners(int mRoundCorners) {
this.mRoundCorners = mRoundCorners;
}
/**
* 点击回调
*/
public static interface OnClickImagesListener {
void onImagesClick(int position);
}
private OnClickImagesListener mImagesListener;
public void setOnClickImagesListener(OnClickImagesListener listener) {
mImagesListener = listener;
}
public BannerPagerAdapter(List list, Context context) {
// this.mList = list;
this.mContext = context;
if (mList == null) {
mList = list;
}
if (list.size() > 9) {
this.mMaxNumber = 9;
} else {
this.mMaxNumber = list.size();
}
}
@Override
public int getCount() {
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
View view = LayoutInflater.from(mContext).inflate(R.layout.banner_img_layout, container, false);
ImageView imageView = (ImageView) view.findViewById(R.id.img);
final int index = position % mMaxNumber;
LoadImage(mList.get(index), imageView);
//OnClick
imageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
mImagesListener.onImagesClick(index);
}
});
container.addView(view);
return view;
}
/**
* 加载图片
*/
public void LoadImage(String url, ImageView imageview) {
if (mRoundCorners == -1) {
Glide.with(mContext)
.load(url)
// .centerCrop()
.dontAnimate()
.diskCacheStrategy(DiskCacheStrategy.AUTOMATIC)//设置磁盘缓存
.into(imageview);
} else {
Glide.with(mContext)
.load(url)
.centerCrop()
.dontAnimate()
.transform(new RoundedCorners(mRoundCorners)) //
.diskCacheStrategy(DiskCacheStrategy.AUTOMATIC)//设置磁盘缓存
.into(imageview);
}
}
} 布局
banner_img_layout.xml
banner_view_layout.xml
使用
banner_3d.initBanner(new Array, true)//开启3D画廊效果
.addPageMargin(-12, 20)//参数1page之间的间距,参数2中间item距离边界的间距
// .addPageMargin(ScreenUtil.dip2px(-3), ScreenUtil.dip2px(8))//参数1page之间的间距,参数2中间item距离边界的间距
// .addPageMargin(8, 0)//参数1page之间的间距,参数2中间item距离边界的间距
.addPointMargin(0)//添加指示器
.addStartTimer(8)//自动轮播5秒间隔
.addPointBottom(7)
.addRoundCorners(ScreenUtil.dip2px(8))//圆角
.finishConfig()//这句必须加
.addBannerListener(new BannerViewPager.OnClickBannerListener() {
@Override
public void onBannerClick(int position) {
}
});
banner_3d.addDefaultImg(R.drawable.edu_zhanweifu);