首页

android开发之仿商城首页Banner图的实现

android开发仿Banner图2018-09-14826

实现效果:当banner滚动的时候 首先会缩放当前以及上一个或下一个banner图,当banner滚动时会,背景会随滚动系数变化缩放(自动滚动),下面郑州app开发公司燚轩科技技术人员来分享一下源码:


//0无状态,1缩放,2放大,3不能再播放动画

private int status = 0;

private void fada() {

if (status == 0 || status == 1) {

AnimatorSet animatorSetsuofang = new AnimatorSet();//组合动画

ObjectAnimator scaleX = ObjectAnimator.ofFloat(viewPager, "scaleX", 0.9f, 1f);

ObjectAnimator scaleY = ObjectAnimator.ofFloat(viewPager, "scaleY", 0.9f, 1f);

animatorSetsuofang.setDuration(500);

animatorSetsuofang.setInterpolator(new LinearInterpolator());

animatorSetsuofang.play(scaleX).with(scaleY);//两个动画同时开始

animatorSetsuofang.addListener(new AnimatorListenerAdapter() {

@Override

public void onAnimationStart(Animator animation) {

super.onAnimationStart(animation);

setViewPagerIsScroll(false);

stopAutoPlay();

status = 3;

}

@Override

public void onAnimationEnd(Animator animation) {

super.onAnimationEnd(animation);

setViewPagerIsScroll(true);

Log.e("as", "sa");

startAutoPlay();

status = 2;

}

});

animatorSetsuofang.start();

}

}

private void suoxia() {

if (status == 0 || status == 2) {

AnimatorSet animatorSetsuofang = new AnimatorSet();//组合动画

ObjectAnimator scaleX = ObjectAnimator.ofFloat(viewPager, "scaleX", 1f, 0.9f);

ObjectAnimator scaleY = ObjectAnimator.ofFloat(viewPager, "scaleY", 1f, 0.9f);

animatorSetsuofang.setDuration(200);

animatorSetsuofang.setInterpolator(new LinearInterpolator());

animatorSetsuofang.play(scaleX).with(scaleY);//两个动画同时开始

animatorSetsuofang.addListener(new AnimatorListenerAdapter() {

@Override

public void onAnimationStart(Animator animation) {

super.onAnimationStart(animation);

setViewPagerIsScroll(false);

stopAutoPlay();

status = 3;

}

@Override

public void onAnimationEnd(Animator animation) {

super.onAnimationEnd(animation);

setViewPagerIsScroll(true);

// startAutoPlay();

status = 1;

}

});

animatorSetsuofang.start();

}

}


动画联动效果实现:


private final Runnable task = new Runnable() {

@Override

public void run() {

if (status == 0 || status == 2) {

AnimatorSet animatorSetsuofang = new AnimatorSet();//组合动画

ObjectAnimator scaleX = ObjectAnimator.ofFloat(viewPager, "scaleX", 1f, 0.9f);

ObjectAnimator scaleY = ObjectAnimator.ofFloat(viewPager, "scaleY", 1f, 0.9f);

animatorSetsuofang.setDuration(300);

animatorSetsuofang.setInterpolator(new LinearInterpolator());

animatorSetsuofang.play(scaleX).with(scaleY);//两个动画同时开始

animatorSetsuofang.addListener(new AnimatorListenerAdapter() {

@Override

public void onAnimationStart(Animator animation) {

super.onAnimationStart(animation);

setViewPagerIsScroll(false);

status = 3;

}

@Override

public void onAnimationEnd(Animator animation) {

super.onAnimationEnd(animation);

setViewPagerIsScroll(true);

if (count > 1 && isAutoPlay) {

currentItem = currentItem % (count + 1) + 1;

// Log.i(tag, "curr:" + currentItem + " count:" + count);

if (currentItem == 1) {

viewPager.setCurrentItem(currentItem, false);

handler.post(task);

} else {

viewPager.setCurrentItem(currentItem);

handler.postDelayed(task, delayTime);

}

}

status = 1;

}

});

animatorSetsuofang.start();

}

}

};


缩放(拖动)效果实现:


@Override

public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

int num = 0;

if (mOnPageChangeListener != null) {

// Log.e("as", "position" + position + " ----positionOffset " + positionOffset + " positionOffsetPixels" + positionOffsetPixels);

// Log.e(scale);

Log.e("as", imageUrls.size() + "" + " currentItem" + currentItem);

if (positionOffset > 0) {

Log.e("as", "position" + position + " currentItem" + currentItem + "mViewPagerIndex" + mViewPagerIndex);

// Log.e("as", mViewPagerIndex + "");

if (touch) {

if (currentItem == imageUrls.size() + 1) {

Glide.with(context).load(imageUrls.get(0)).into(roundImageView);

Glide.with(context).load(imageUrls.get(0)).into(roundImagetwo);

} else {

if (currentItem == 0) {

Glide.with(context).load(imageUrls.get(imageUrls.size() - 1)).into(roundImageView);

Glide.with(context).load(imageUrls.get(imageUrls.size() - 1)).into(roundImagetwo);

} else {

Glide.with(context).load(imageUrls.get(currentItem - 1)).into(roundImageView);

Glide.with(context).load(imageUrls.get(currentItem - 1)).into(roundImagetwo);

}

}

if (position == mViewPagerIndex) {

Log.e("tt", "左");

if (position == imageUrls.size()) {

num = 0;

} else {

num = position;

}

Glide.with(context).load(imageUrls.get(num)).diskCacheStrategy(DiskCacheStrategy.ALL).into(mImagebg);

roundImageView.setVisibility(VISIBLE);

roundImagetwo.setVisibility(INVISIBLE);

} else {

Log.e("tt", "右");

if (position == 0) {

num = imageUrls.size();

} else {

num = position;

}

Glide.with(context).load(imageUrls.get(num - 1)).diskCacheStrategy(DiskCacheStrategy.ALL).into(mImagebg);

roundImagetwo.setVisibility(VISIBLE);

roundImageView.setVisibility(INVISIBLE);

}

} else {

if (!touchover) {

if (position < currentItem) {

roundImageView.setVisibility(VISIBLE);

roundImagetwo.setVisibility(INVISIBLE);

}

}

if (position == imageUrls.size()) {

Glide.with(context).load(imageUrls.get(0)).diskCacheStrategy(DiskCacheStrategy.ALL).into(mImagebg);

} else if (position == 0) {

num = imageUrls.size();

Glide.with(context).load(imageUrls.get(num - 1)).diskCacheStrategy(DiskCacheStrategy.ALL).into(mImagebg);

} else {

if (position == mViewPagerIndex) {

Glide.with(context).load(imageUrls.get(position)).diskCacheStrategy(DiskCacheStrategy.ALL).into(mImagebg);

} else {

if (!touchover) {

Glide.with(context).load(imageUrls.get(position)).diskCacheStrategy(DiskCacheStrategy.ALL).into(mImagebg);

} else {

Glide.with(context).load(imageUrls.get(position - 1)).diskCacheStrategy(DiskCacheStrategy.ALL).into(mImagebg);

roundImageView.setVisibility(INVISIBLE);

roundImagetwo.setVisibility(VISIBLE);

}

//

}

}

}

//

} else {

roundImagetwo.setVisibility(VISIBLE);

roundImageView.setVisibility(VISIBLE);

if (currentItem == imageUrls.size() + 1) {

Glide.with(context).load(imageUrls.get(0)).into(roundImageView);

Glide.with(context).load(imageUrls.get(0)).into(roundImagetwo);

} else {

if (currentItem == 0) {

Glide.with(context).load(imageUrls.get(imageUrls.size() - 1)).into(roundImageView);

Glide.with(context).load(imageUrls.get(imageUrls.size() - 1)).into(roundImagetwo);

} else {

Glide.with(context).load(imageUrls.get(currentItem - 1)).into(roundImageView);

Glide.with(context).load(imageUrls.get(currentItem - 1)).into(roundImagetwo);

}

}

}

roundImagetwo.setRound(1f - positionOffset);

roundImageView.setRound(positionOffset);

if ((positionOffset == 0) && touch == false) {

fada();

}

mOnPageChangeListener.onPageScrolled(toRealPosition(position), positionOffset, positionOffsetPixels);

}

}


轮播图数据绑定


banner.setImages(imagebgUrls)

.setImageLoader(new GlideImageLoader())

.setImageList(images)

.start();


好了,到这里就算是完后才能了,如果大家需要改banner依赖包的setImageList()方法,不然无法在主线程中添加数据,还存在不理解的地方也是可以咨询郑州app开发公司燚轩科技获取解答的。

分享到微信朋友圈+
打开微信,点击底部的“发现”,使用 “扫一扫” 即可将网页分享到我的朋友圈。 如何使用?
推荐文章

热贴More +

服务范围More +

联系我们

请扫二维码联系客服

854221200@qq.com

185-3825-9583

QQ客服

关于  ·  招聘  ·  案例中心  ·  网站地图

©@2018 燚轩科技版权所有 豫ICP备16015002号-4

百度提供搜索支持