android轮播图

在许多应用中都会看到轮播图这个组件，想网易新闻、优酷等一些应用。
那么究竟是怎么做的呢？其实很简单，通过ViewPager这个视图组件再加上
PagerAdapter适配器就能做出。我们来看一下代码：
//dot_white.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#ffffff" />
</shape>
//dot_black.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#aa000000" />
</shape>
//select_dot.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/dot_white" android:state_enabled="true" />
    <item android:drawable="@drawable/dot_black" android:state_enabled="false" />
</selector>
//adapter_page.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/iv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@mipmap/a" />
</LinearLayout>
//activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/ll"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.shuaijie.jiang.framedemo.MainActivity">
    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="200dp"></android.support.v4.view.ViewPager>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/vp"
        android:background="#77000000"
        android:orientation="vertical"
        android:padding="8dp">
        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:text="我是文本"
            android:textColor="#ffffff"
            android:textSize="18sp" />
        <LinearLayout
            android:id="@+id/dot_layout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:orientation="horizontal">
        </LinearLayout>
    </LinearLayout>
</RelativeLayout>
//MainActivity.java
public class MainActivity extends AppCompatActivity {
    private ViewPager vp;
    private List<AdapterItem> data;
    private TextView tv;
    private LinearLayout dotLayout;
    private Handler handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            if (vp.getCurrentItem() == data.size() - 1) {
            //如果是最后一页则跳到第一页
                vp.setCurrentItem(0);
            } else {//跳到下一页
                vp.setCurrentItem(vp.getCurrentItem() + 1);
            }
            handler.sendEmptyMessageDelayed(0, 2000);
        }
    };
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        vp = (ViewPager) findViewById(R.id.vp);
        data = new ArrayList<>();
        dotLayout = (LinearLayout) findViewById(R.id.dot_layout);
        tv = (TextView) findViewById(R.id.tv);
        data.add(new AdapterItem(R.mipmap.a, "第一张"));
        data.add(new AdapterItem(R.mipmap.b, "第二张"));
        data.add(new AdapterItem(R.mipmap.c, "第三张"));
        data.add(new AdapterItem(R.mipmap.d, "第四张"));
        data.add(new AdapterItem(R.mipmap.e, "第五张"));
        for (int i = 0; i < data.size(); i++) {
            View view = new View(this);
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(8, 8);
            if (i != 0) {
                params.leftMargin = 5;
            }
            view.setLayoutParams(params);
            view.setBackgroundResource(R.drawable.select_dot);
            dotLayout.addView(view);
        }
        vp.setAdapter(new MyPagerAdapter());
        updateTextAndDot();
        vp.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }
            @Override
            public void onPageSelected(int position) {
                updateTextAndDot();
            }
            @Override
            public void onPageScrollStateChanged(int state) {
            }
        });
        handler.sendEmptyMessageDelayed(0, 2000);
        //每过2秒发一条消息通知翻页
    }
    public void updateTextAndDot() {
        int currentItem = vp.getCurrentItem();
        tv.setText(data.get(currentItem).getTitle());
        for (int i = 0; i < data.size(); i++) {
            dotLayout.getChildAt(i).setEnabled(i == currentItem);
        }
    }
    //数据项实体类
    class AdapterItem {
        private int id;
        private String title;
        public AdapterItem(int id, String title) {
            this.id = id;
            this.title = title;
        }
        public void setId(int id) {
            this.id = id;
        }
        public void setTitle(String title) {
            this.title = title;
        }
        public int getId() {
            return id;
        }
        public String getTitle() {
            return title;
        }
    }
    //ViewPager适配器，给ViewPager填充数据
    class MyPagerAdapter extends PagerAdapter {
        //返回多少页
        @Override
        public int getCount() {
            return data.size();
        }
        //如果返回值为true，表示不去创建，使用缓存。如果为false则重新创建。
        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }
        //将数据设置给view显示
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            View view = View.inflate(MainActivity.this, R.layout.adapter_page, null);
            ImageView iv = (ImageView) view.findViewById(R.id.iv);
            AdapterItem ai = data.get(position);
            iv.setImageResource(ai.getId());
            container.addView(view);//将view加到ViewPager中
            return view;
        }
        //销毁页面
        //position表示当前需要消耗第几个页面
        //object表示当前需要消耗的页面
        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView((View) object);
        }
    }

}