效果图:
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下载