Android——PageView轮播实现

博文目的：

课堂上老师讲了遍，课后自己又敲了遍，现在再来复习一遍。

实现功能

代码环境

貌似不重要，只要是实现思路

创建视图文件

创建在layout目录下创建 activity_viewpager.xml 文件

MyPageView是自己创建的类，主要是显示当前页面。

LinearLayout 是用于创建小圆点的容器。

<?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="200dp"
    >
      <com.gx.myapplication.control.MyPageView
       android:id="@+id/av_viewav_pager"
       android:layout_width="match_parent"
       android:layout_height="match_parent" >
   </com.gx.myapplication.control.MyPageView>

   <LinearLayout
       android:id="@+id/av_indicator"
       android:orientation="horizontal"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_centerHorizontal="true"
       android:layout_alignParentBottom="true"
       android:layout_marginBottom="20dp">
   </LinearLayout>

</RelativeLayout>

重写MyPageView类

在其他位置创建MyPageView类

package com.gx.myapplication.control;


import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.MotionEvent;

/**
 * 重写PageView控件
 *
 * MyPageView
 * data 2017/9/11 14:44
 * author L-z
 */

/* 这个类主要是可以重写ViewPager，重点重写了用户的各种事件，并用
 * getParent().requestDisallowInterceptTouchEvent(false)
 * 来限制当前事件是否响应
  * */
public class MyPageView extends ViewPager {

    /* 初始化 */
    public MyPageView(Context context, AttributeSet attributeSet){
        super(context,attributeSet);
    }
    /*  这个方法的特定套路 */
    @Override
    public boolean dispatchTouchEvent(MotionEvent event){
        switch(event.getAction()){
            /* 按下事件*/
            case MotionEvent.ACTION_DOWN:
                    /* 记录手指按下的值 */
                last_dx=event.getX();
                last_dy=event.getY();
                /* 默认响应事件 这里表示优先执行*/
                getParent().requestDisallowInterceptTouchEvent(true);
                break;
            /* 手指滑动事件 */
            case MotionEvent.ACTION_MOVE:
                /* 该判断表示 水平滑动的距离是大于垂直滑动的距离 */
                if(Math.abs(event.getX()-last_dx)>Math.abs(event.getY())){
                    getParent().requestDisallowInterceptTouchEvent(true);
                }else{
                    /* 不执行事件 */
                    getParent().requestDisallowInterceptTouchEvent(false);
                }
                break;
            /* 其他事件 */
            case MotionEvent.ACTION_CANCEL:
                getParent().requestDisallowInterceptTouchEvent(true);
                break;
            default:
                break;
        }
        return super.dispatchTouchEvent(event);
    }
    /* 记录的值 */
    float last_dx;
    float last_dy;
}

创建activity_viewpage_itme.xml文件

这里才是每个轮播图的ImageView

<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:id="@+id/cover"
    android:background="@android:color/holo_red_light"
    android:scaleType="centerCrop"
    android:contentDescription="@string/app_name"
    android:src="@drawable/bg3">

</ImageView>

创建 Activity

创建Second_Activity.java的文件，这里就不详细描述了

注意，我是在ListView的头部加入轮播的

这里说一下思路：首先在onCreate中先得到轮播视图中的MyPageView对象和小圆点对象，然后将整个轮播视图放在ListView的头部。当然，还要依赖 轮播图的实现类 MyVpAdater 主要是添加视图和切换视图。
接下来就是加载数据了，initPages()方法。还有个细节就是轮播切换的时候，需要更改小圆点addOnPageChangeListener事件

    /**
 * 方法结构：
 *     1、系统构造方法重写
 *     2、加载数据
 *     3、对应的实现类+对应的方法
 * Second_Activity
 * data 2017/9/11 16:41
 * author L-z
 */
public class Second_Activity extends AppCompatActivity {
    @Override
    protected void onCreate( Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_listview);
        /* 加载ListView数据 */
        myAdapter=new MyAdapter();
        ListView listView=(ListView)findViewById(R.id.listView);
        listView.setAdapter(myAdapter);
        /* 加载数据 */
        initData();       

        /* 实例化ViewPage文件 */
        View View=getLayoutInflater().inflate(R.layout.activity_viewpager,listView,false);
        /*  获取ViewPage 中的对象 */
        pageView= (MyPageView)View.findViewById(R.id.av_viewav_pager);
        indicator= (LinearLayout)View.findViewById(R.id.av_indicator);
         /* 轮播图的实现类 */
        myVpAdapter = new MyVpAdater();
        pageView.setAdapter(myVpAdapter);
         /* 添加滑动事件 */
        pageView.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }
            @Override
            public void onPageSelected(int position) {

            }
            /* 手指滑动后 更新小圆点 */
            @Override
            public void onPageScrollStateChanged(int state) {
                if (state == ViewPager.SCROLL_STATE_SETTLING) {
                    updateIndicator();
                }
            }
        });

        /* 将轮播图放在ListView的头部 */
        listView.addHeaderView(View);
    }

    /* 加载列表数据 */
    public void initData () {
        /* 这里是通过网路拉取数据的 */
        itemobjs.add(new Itemobj("正常运行","一天前","正在加载数据",""));
        Log.d("Show","开始执行");
        AsyncHttpClient client=new AsyncHttpClient();
        try{
            /* 地址就不给你们了 */
            client.get("http://*******************",new AsyncHttpResponseHandler(){
                @Override
                public void onSuccess(int statusCode, Header[] headers, byte[] responseBody) {
                    Log.d("Show","到这里了，说明方法没问题");
                    try {
                        JSONObject object=new JSONObject(new String(responseBody));
                        JSONArray jsonArray=object.getJSONArray("novels");
                        itemobjs.clear();
                        for(int i=0;i<jsonArray.length();i++){
                            JSONObject jsonObject=jsonArray.getJSONObject(i);

                            //String novel_url=jsonObject.getString("novel_url");
                            //Log.d("show","路径："+novel_url);
                            itemobjs.add(new Itemobj(
                                    jsonObject.getString("author"),
                                    jsonObject.getString("updated"),
                                    jsonObject.getString("novel_name"),
                                    jsonObject.getString("poster")
                            ));
                        }
                        Log.d("Show","没问题");
                        /* 加载轮播图 */
                        initPages();
                        /* 最后加载到ListView中 */
                        myAdapter.notifyDataSetChanged();
                        //加载轮播图
                        myVpAdapter.notifyDataSetChanged();
                    } catch (JSONException e) {
                        e.printStackTrace();
                    }
                }
                @Override
                public void onFailure(int statusCode, Header[] headers, byte[] responseBody, Throwable error) {
                }
           });
        }catch (Exception e){
            e.printStackTrace();
        }
    }

    /* 加载轮播数据 */
    public void initPages(){
        /* 添加分页数据 */
        pages.clear();
        ImageView cover = (ImageView) getLayoutInflater().inflate(R.layout.activity_viewpage_itme, null);
        cover.setImageResource(R.drawable.bg1);
        pages.add(cover);
        cover = (ImageView) getLayoutInflater().inflate(R.layout.activity_viewpage_itme, null);
        cover.setImageResource(R.drawable.bg2);
        pages.add(cover);
        cover = (ImageView) getLayoutInflater().inflate(R.layout.activity_viewpage_itme, null);
        cover.setImageResource(R.drawable.bg3);
        pages.add(cover);

        /* 更新小圆点 */
        indicator.removeAllViews();
        for (int i=0;i<3;++i){
            float width = Tool.dip2px(this,8.0f);
            float height = Tool.dip2px(this,8.0f);
            float margin_right = Tool.dip2px(this, 5.0f);
            View view = new View(this);

            /* 设置第一为被选中 */
            if (i==0) {
                view.setBackgroundResource(R.mipmap.indicator_selected);
            }else {
                view.setBackgroundResource(R.mipmap.indicator_nor);
            }
            /* 因为当前布局是LinearLayout 布局 所以是 LayoutParams参数*/
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams((int)width, (int)height, 1.0f);
            params.rightMargin = (int)margin_right;
            view.setLayoutParams(params);
            indicator.addView(view);
        }
    }

    /* 实现ListView的主要类 */
    class MyAdapter extends BaseAdapter {

        @Override
        public int getCount() {
            return itemobjs.size();
        }

        @Override
        public Object getItem(int position) {
            return itemobjs.get(position);
        }

        @Override
        public long getItemId(int position) {
            return 1;
        }
        /* 滑动加载View */
        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            Holder holder;
            /* 重用 converView */
            if(convertView == null){
                convertView = getLayoutInflater().inflate(R.layout.activity_relativelayout,null);
                holder=new Holder();
                holder.name=(TextView)convertView.findViewById(R.id.rl_name);
                holder.author=(TextView)convertView.findViewById(R.id.rl_author);
                holder.date=(TextView)convertView.findViewById(R.id.rl_date);
                convertView.setTag(holder);
            }else{
                holder=(Holder)convertView.getTag();
            }
            Itemobj itemobj=(Itemobj)getItem(position);
            holder.name.setText(itemobj.name);
            holder.author.setText(itemobj.author);
            holder.date.setText(itemobj.date);
            ImageView imageView = (ImageView)convertView.findViewById(R.id.rl_View);
            imageView.setImageResource(R.drawable.bg2);
            /* 加载图片 由于虚拟机问题 先注释 真机测试OK */
            //IMAGE_CACHE.get(itemobj.imgUrtView.findViewById(R.id.rl_View));
            return convertView;
        }
    }

    /* 用于接收数据 */
    class Itemobj{

        Itemobj(String author,String date,String name,String imgUrl){
            this.author=author;
            this.date=date;
            this.name=name;
            this.imgUrl=imgUrl;
        }
        String name;
        String author;
        String date;
        String imgUrl;
    }

    /* 储存实际的控件 */
    class Holder{
        TextView name;
        TextView author;
        TextView date;
    }

    /* 轮播图的实现类 */
    class MyVpAdater extends PagerAdapter {

        /* 获取大小 */
        @Override
        public int getCount() {
            return pages.size();
        }

        /* 判断是相等 */
        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        /* 添加视图 并返回当前视图*/
        @Override
        public Object instantiateItem (ViewGroup container, int position) {
            container.addView(pages.get(position));
            return pages.get(position);
        }

        /* 移除视图 */
        @Override
        public void destroyItem (ViewGroup container,int position, Object object) {
            View view = (View) object;
            container.removeView(view);
        }
    }

    /* 用于更新轮播图中的导航点  */
    public void updateIndicator () {
        int pos = pageView.getCurrentItem();
        /* 先全部设置背景颜色为空 */
        for (int i=0; i<indicator.getChildCount(); ++i) {
            View view = indicator.getChildAt(i);
            view.setBackgroundResource(R.mipmap.indicator_nor);
        }
        /* 设置当前选中的颜色 */
        indicator.getChildAt(pos).setBackgroundResource(R.mipmap.indicator_selected);
    }

    /* 列表的实现类 */
    MyAdapter myAdapter;
    /* 列表集合 */
    List<Itemobj> itemobjs=new LinkedList<>();
    /* 轮播页集合 */
    List<View> pages = new LinkedList<>();
    /* 轮播图的实现类 */
    MyVpAdater myVpAdapter;
    /* 轮播图对象 */
    MyPageView pageView;
    /* 小圆点对象 */
    LinearLayout indicator;
}