App主界面Tab实现(一) ViewPager实现Tab

1. ViewPager

ViewPager是V4包里面的一个类，可以通过ViewPager实现点击和滑动效果。但是需要把不同页面的初始化和所有点击事件写在一个Activity，导致代码查看和维护很困难。

1.1 首先主XML中是一个ViewPager加一个Tab导航栏

<include layout="@layout/market_header"/>

    <android.support.v4.view.ViewPager
        android:id="@+id/vp_market"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
    </android.support.v4.view.ViewPager>

    <include layout="@layout/market_bottom"/>

底部导航栏根据自己需要写

1.2 创建对应页面的布局文件

1.3 在主页面中完成ViewPager，适配器，View资源的定义

private ViewPager mViewPager;
private PagerAdapter mAdapter;
private List<View> mList = new ArrayList<>();

1.4 把对应布局文件转化成View,并添加到mList中

LayoutInflater mInflater = LayoutInflater.from(this);
View index = mInflater.inflate(R.layout_index,null);
        ...

mList.add(index);
        ...

1.5 初始化适配器，重写destroy和init代码

mAdapter = new PagerAdapter() {

            @Override
            public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
                container.removeView(mList.get(position));
            }
            
            @Override
            public Object instantiateItem(ViewGroup container, int position) {
                View view = mList.get(position);
                container.addView(view);
                return view;
            }
            
            public int getCount() {
                return mList.size();
            }

            @Override
            public boolean isViewFromObject(View view, Object o) {
                return view == o;
            }
        };

1.6 为ViewPager配置适配器

mViewPager.setAdapter(mAdapter);

1.7 实现点击Tab切换页面效果

@Override
    public void onClick(View v) {
        switch (v.getId) {
            case R.id.index:
                //ImageButton变色效果
                    ...
                //切换View
                mViewPager.setCurrentItem(1);
                break;
                ...
        }
    }

1.8 添加滑动对应Tab跟随变化效果

mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int i, float v, int i1) {

            }

            @Override
            public void onPageSelected(int i) {
                int pos = mViewPager.getCurrentItem();
                switch(pos) {
                    //对应Tab的效果变化
                }
            }

            @Override
            public void onPageScrollStateChanged(int i) {

            }
        });