【Android】viewpager banner 广告 自动轮播 小圆点

时间:2022-02-13 16:34:39

效果图:

【Android】viewpager banner 广告 自动轮播 小圆点

1.首先自定义一个LinearLayout 

package com.i4evercai.bannerdemo.ui;

import java.util.ArrayList;
import java.util.List;
import java.util.Timer;
import java.util.TimerTask;

import android.app.Activity;
import android.content.Context;
import android.os.Handler;
import android.os.Message;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.view.LayoutInflater;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;

import com.i4evercai.bannerdemo.R;

public class BannerView extends LinearLayout {
private ViewPager adViewPager;
private ViewGroup group;
private List<ImageView> bannerViewList = new ArrayList<ImageView>();
private RelativeLayout pagerLayout;
private int pageCount;
private Timer bannerTimer;
private Handler handler;
private BannerTimerTask bannerTimerTask;
public BannerView(Context context) {
super(context);

}

public BannerView(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
inflater.inflate(R.layout.banner_view, this);
initView(context);
handler = new Handler() {
public void handleMessage(Message msg) {
adViewPager.setCurrentItem(msg.what);
super.handleMessage(msg);

}
};
bannerTimer = new Timer();
}

private void initView(final Context context) {
RelativeLayout layout = (RelativeLayout) this
.findViewById(R.id.view_pager_content);
adViewPager = (ViewPager) this.findViewById(R.id.viewPager1);
group = (ViewGroup) findViewById(R.id.iv_image);

DisplayMetrics dm = new DisplayMetrics();
((Activity) context).getWindowManager().getDefaultDisplay()
.getMetrics(dm);
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) layout
.getLayoutParams();
//根据图片高和宽的比例计算高度
//测试图宽为694 高为323
params.height = (int) (((double) dm.widthPixels / (double) 694 * (double) 323));
layout.setLayoutParams(params);

ImageView imageView;
//初始化数据
for (int i = 0; i < 8; i++) {
imageView = new ImageView(context);
imageView.setImageResource(R.drawable.banner);
bannerViewList.add(imageView);
}

pageCount = bannerViewList.size();//对应小点个数
final ImageView[] imageViews = new ImageView[pageCount];
for (int i = 0; i < pageCount; i++) {
LinearLayout.LayoutParams margin = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
// 设置每个小圆点距离左边的间距
margin.setMargins(10, 0, 0, 0);
imageView = new ImageView(context);
// 设置每个小圆点的宽高
imageView.setLayoutParams(new LayoutParams(15, 15));
imageViews[i] = imageView;
if (i == 0) {
// 默认选中第一张图片
imageViews[i]
.setBackgroundResource(R.drawable.page_indicator_focused);
} else {
// 其他图片都设置未选中状态
imageViews[i]
.setBackgroundResource(R.drawable.page_indicator_unfocused);
}
group.addView(imageViews[i], margin);
}
BannerViewAdapter adapter = new BannerViewAdapter(context,
bannerViewList);
adViewPager.setAdapter(adapter);
adViewPager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub

}

@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}

@Override
public void onPageSelected(int arg0) {
//当viewpager换页时 改掉下面对应的小点
for (int i = 0; i < imageViews.length; i++) {
//设置当前的对应的小点为选中状态
imageViews[arg0]
.setBackgroundResource(R.drawable.page_indicator_focused);
if (arg0 != i) {
//设置为非选中状态
imageViews[i]
.setBackgroundResource(R.drawable.page_indicator_unfocused);
}
}
}

});
}


//启动banner自动轮播
public void bannerStartPlay(){
if (bannerTimer != null) {
if (bannerTimerTask != null)
bannerTimerTask.cancel();
bannerTimerTask = new BannerTimerTask();
bannerTimer.schedule(bannerTimerTask, 5000, 5000);//5秒后执行,每隔5秒执行一次
}
}
//暂停banner自动轮播
public void bannerStopPlay(){
if (bannerTimerTask != null)
bannerTimerTask.cancel();
}
class BannerTimerTask extends TimerTask {
@Override
public void run() {
// TODO Auto-generated method stub
System.out.println("banner playing");
Message msg = new Message();
if (bannerViewList.size() <= 1)
return;
int currentIndex = adViewPager.getCurrentItem();
if (currentIndex == bannerViewList.size() - 1)
msg.what = 0;
else
msg.what = currentIndex + 1;

handler.sendMessage(msg);
}

}
}

2.对应的adapter

package com.i4evercai.bannerdemo.ui;

import java.util.List;

import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;

public class BannerViewAdapter extends PagerAdapter {
private List<ImageView> list;
private Context context;

public BannerViewAdapter(Context context, List<ImageView> list) {
this.context = context;
this.list = list;
}

@Override
public int getCount() {
// TODO Auto-generated method stub
return list.size();
}

@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0 == arg1;
}

public ImageView instantiateItem(View arg0, final int arg1) {
((ViewPager) arg0).addView(list.get(arg1));
list.get(arg1).setOnClickListener(new OnClickListener(){

@Override
public void onClick(View view) {
// TODO Auto-generated method stub
System.out.println("onClick:"+arg1);
}

});
return list.get(arg1);
}

@Override
public void destroyItem(View arg0, int arg1, Object arg2) {
((ViewPager) arg0).removeView((View) arg2);
}
}
3. 将自定义LinearLayout添加到布局里面

 <com.i4evercai.bannerdemo.ui.BannerView
android:id="@+id/bannerview1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
</com.i4evercai.bannerdemo.ui.BannerView>

4.在activity里面实例对象

bannerView=(BannerView) findViewById(R.id.bannerview1);

5.在onResume() onPause()里面添加banner自动轮播开始和暂停

protected void onResume() {
super.onResume();
bannerView.bannerStartPlay();
}

@Override
protected void onPause() {
super.onPause();
bannerView.bannerStopPlay();
}


demo下载