Android--顶部轮播图

记录：虽然网络上已经有很多很不错三方jar包做顶部轮播图，但是作为一个学习者，还是要了解其中原理，轮子是圆是方，是木头还是橡胶都要自己琢磨一遍。以下记录这次造轮子的相关代码，然后会在项目中删除。
    首先，我想相当于自定义控件，在首布局中引入，名字要写全包名。然后新建一个类来写这个控件，配置相关的xml文件。介绍如下。
首页中引入这个控件，类名为SlideShowView:

SlideShowView.java

/** * 首页的banner展现，可以手动，自动轮播 *  * @author 作者：Anshay * @version 创建时间：2017-6-4 */public class SlideShowView extends FrameLayout {// 自动轮播启用开关private final static boolean isAutoPlay = true;// 放轮播图片的ImageView 的listprivate List<ImageView> imageViewsList;// 放圆点的View的listprivate List<View> dotViewsList;// 翻页控件private ViewPager viewPager;// 当前轮播页private int currentItem = 0;// 定时任务private ScheduledExecutorService scheduledExecutorService;/* 首页banner */public static int[] BANNER_IMGS = { R.drawable.banner_01,R.drawable.banner_02, R.drawable.banner_03 };// Handlerprivate Handler handler = new Handler() {// 处理反馈的消息@Overridepublic void handleMessage(Message msg) {super.handleMessage(msg);viewPager.setCurrentItem(currentItem);// 设置当前页面}};public SlideShowView(Context context) {this(context, null);}public SlideShowView(Context context, AttributeSet attrs) {this(context, attrs, 0);}public SlideShowView(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);initData();initUI(context);if (isAutoPlay) {startPlay();}}/** * 开始轮播图切换 */private void startPlay() {scheduledExecutorService = Executors.newSingleThreadScheduledExecutor();scheduledExecutorService.scheduleAtFixedRate(new SlideShowTask(), 1, 4,TimeUnit.SECONDS);}/** * 初始化相关数据 */private void initData() {// 实例化两个集合imageViewsList = new ArrayList<ImageView>();dotViewsList = new ArrayList<View>();}/** * 初始化Views等UI */private void initUI(Context context) {LayoutInflater.from(context).inflate(R.layout.layout_slideshow, this,true);LinearLayout ll = (LinearLayout) findViewById(R.id.dotLayout);for (int imageID : BANNER_IMGS) {ImageView imgview = new ImageView(context);imgview.setImageResource(imageID);imgview.setScaleType(ScaleType.FIT_XY);imageViewsList.add(imgview);}dotViewsList.add(findViewById(R.id.v_dot1));dotViewsList.add(findViewById(R.id.v_dot2));dotViewsList.add(findViewById(R.id.v_dot3));viewPager = (ViewPager) findViewById(R.id.viewPager);viewPager.setFocusable(true);// 设置可聚焦viewPager.setAdapter(new MyPagerAdapter());// 设置适配器viewPager.setOnPageChangeListener(new MyPageChangeListener());// 设置监听器}/** * 填充ViewPager的页面适配器 *  * @author Anshay 下午5:02:20 */private class MyPagerAdapter extends PagerAdapter {@Overridepublic int getCount() {return imageViewsList.size();}@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return arg0 == arg1;}@Overridepublic Object instantiateItem(View container, int position) {((ViewPager) container).addView(imageViewsList.get(position));return imageViewsList.get(position);}@Overridepublic void destroyItem(View container, int position, Object object) {((ViewPager) container).removeView(imageViewsList.get(position));}@Overridepublic void restoreState(Parcelable arg0, ClassLoader arg1) {}@Overridepublic Parcelable saveState() {return null;}@Overridepublic void startUpdate(View arg0) {}@Overridepublic void finishUpdate(View arg0) {}}/** * ViewPager的监听器 当ViewPager中页面的状态发生改变时调用 *  * @author Anshay 下午5:02:32 */private class MyPageChangeListener implements OnPageChangeListener {boolean isAutoPlay = false;@Override// 页面正在滑动public void onPageScrolled(int arg0, float arg1, int arg2) {}// 页面滑动状态@Overridepublic void onPageScrollStateChanged(int arg0) {switch (arg0) {case 1:// 手势滑动，空闲中isAutoPlay = false;Log.d("dd", "手势滑动，空闲中");break;case 2:// 界面切换中Log.d("界面切换中", "滑动结束");isAutoPlay = true;break;case 0:// 滑动结束，即切换完毕或者加载完毕// 当前为最后一张，此时从右向左滑，则切换到第一张Log.d("dd", "滑动结束");if (viewPager.getCurrentItem() == viewPager.getAdapter().getCount() - 1 && !isAutoPlay) {viewPager.setCurrentItem(0);}// 当前为第一张，此时从左向右滑，则切换到最后一张else if (viewPager.getCurrentItem() == 0 && !isAutoPlay) {viewPager.setCurrentItem(viewPager.getAdapter().getCount() - 1);}break;}}// 页面被确定选择时@Overridepublic void onPageSelected(int position) {// 设置下方小圆点图片（当前页面的为红色图片，非当前页面的为灰色图片）currentItem = position;for (int i = 0; i < dotViewsList.size(); i++) {if (i == position) {((View) dotViewsList.get(position)).setBackgroundResource(R.drawable.banner_bar_selected);} else {((View) dotViewsList.get(i)).setBackgroundResource(R.drawable.banner_bar);}}}}/** * 执行轮播图切换任务 */private class SlideShowTask implements Runnable {@Overridepublic void run() {synchronized (viewPager) {currentItem = (currentItem + 1) % imageViewsList.size();// 发送消息给handle去处理（切换viewPager当前视图）handler.obtainMessage().sendToTarget();}}}/** * 销毁ImageView资源，回收内存 */private void destoryBitmaps() {for (int i = 0; i < BANNER_IMGS.length; i++) {ImageView imageView = imageViewsList.get(i);Drawable drawable = imageView.getDrawable();if (drawable != null) {// 解除drawable对view的引用drawable.setCallback(null);}}}}

layout_slideshow.xml布局

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:orientation="vertical" >    <android.support.v4.view.ViewPager        android:id="@+id/viewPager"        android:layout_width="match_parent"        android:layout_height="wrap_content" />    <LinearLayout        android:id="@+id/dotLayout"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:gravity="center"        android:orientation="horizontal"        android:padding="8dp" >        <View            android:id="@+id/v_dot1"            android:layout_width="8dp"            android:layout_height="8dp" />        <View            android:id="@+id/v_dot2"            android:layout_width="8dp"            android:layout_height="8dp"            android:layout_marginLeft="5dp" />        <View            android:id="@+id/v_dot3"            android:layout_width="8dp"            android:layout_height="8dp"            android:layout_marginLeft="5dp" />    </LinearLayout></RelativeLayout>

所选的圆点图片

1  2  3  4