MagicIndicator的基本使用

<1.fragment中添加viewpage和MagicIndicator

public class BaseFragment extends Fragment {
    List<String> mDataList;
    ViewPager mViewPager;
    List<View> viewList;
    private MagicIndicator mMagicIndicator;
    private View mView;
    private CommonNavigator mCommonNavigator;

    /**
     * fragment入口
     * @param inflater
     * @param container
     * @param savedInstanceState
     * @return
     */
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        Log.e("BaseFragment","onCreateView");
        initView();
        initData(inflater);
        initEvent();
        //mViewPager.setCurrentItem(1);
        return mView;
    }

    /**
     * 初始化点击事件
     */
    private void initEvent() {
        //指示器的设置
        mCommonNavigator.setAdapter(new CommonNavigatorAdapter() {
            @Override
            public int getCount() {
                return mDataList == null ? 0 : mDataList.size();
            }
            @Override
            public IPagerTitleView getTitleView(Context context, final int index) {
                ClipPagerTitleView clipPagerTitleView = new ClipPagerTitleView(context);
                clipPagerTitleView.setText(mDataList.get(index));
                clipPagerTitleView.setTextColor(Color.parseColor("#59bf17"));
                clipPagerTitleView.setClipColor(Color.WHITE);
                clipPagerTitleView.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        mViewPager.setCurrentItem(index);
                    }
                });
                return clipPagerTitleView;
            }
            @Override
            public IPagerIndicator getIndicator(Context context) {
                return null;    // 没有指示器，因为title的指示作用已经很明显了
            }
        });
        mMagicIndicator.setNavigator(mCommonNavigator);
        //设置viewpage页面发生改变,指示器发生改变
        mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                mMagicIndicator.onPageScrolled(position, positionOffset, positionOffsetPixels);
               // Log.e("BaseFragment","onPageScrolled:"+ position);
            }
            @Override
            public void onPageSelected(int position) {
                mMagicIndicator.onPageSelected(position);
               // Log.e("BaseFragment","onPageSelected:"+ position);
            }
            @Override
            public void onPageScrollStateChanged(int state) {
                mMagicIndicator.onPageScrollStateChanged(state);
               // Log.e("BaseFragment","onPageScrollStateChanged:"+ state);
            }
        });
        //设置viewpage的adapter
        mViewPager.setAdapter(new PagerAdapter() {
            @Override
            public int getCount() {
               // Log.e("BaseFragment","getCount:"+ viewList.size());
                return viewList.size();
            }

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

            @Override
            public Object instantiateItem(ViewGroup container, int position) {
                container.addView(viewList.get(position));
               // Log.e("BaseFragment","instantiateItem:"+ position);
                return  viewList.get(position);
            }

            @Override
            public void destroyItem(ViewGroup container, int position, Object object) {
                container.removeView(viewList.get(position));
            }
        });
    }

    /**
     * 初始化数据
     * @param inflater
     */
    private void initData(LayoutInflater inflater) {
        mDataList = new ArrayList<>();
        mDataList.add("时间同步");
        mDataList.add("设备信息");
        mDataList.add("本机网络");
        mDataList.add("串口通信");
        mDataList.add("后台通信");
        View view1 = inflater.inflate(R.layout.base_fragment_sync_time,null);
        View view2 = inflater.inflate(R.layout.base_fragment_device_message,null);
        View view3 = inflater.inflate(R.layout.base_fragment_device_net,null);
        View view4 = inflater.inflate(R.layout.base_fragment_serial_port_communication,null);
        View view5 = inflater.inflate(R.layout.base_fragment_backstage_communication,null);
        viewList = new ArrayList<View>();
        viewList.add(view1);
        viewList.add(view2);
        viewList.add(view3);
        viewList.add(view4);
        viewList.add(view5);
    }

    /**
     * 初始化view
     */
    private void initView() {
        mView = LayoutInflater.from(getActivity()).inflate(R.layout.base_fragment, null);
        mMagicIndicator = (MagicIndicator) mView.findViewById(R.id.magic_indicator);
        mViewPager = (ViewPager) mView.findViewById(R.id.view_pager);
        mCommonNavigator = new CommonNavigator(Utils.getContext());
    }

    /**
     *
     * @param menuVisibile
     */
    //重写setMenuVisibility方法，不然会出现叠层的现象
    @Override
    public void setMenuVisibility(boolean menuVisibile) {
        super.setMenuVisibility(menuVisibile);
        if (this.getView() != null) {
            this.getView().setVisibility(menuVisibile ? View.VISIBLE : View.GONE);
        }
    }
}

<2.base_fragment.xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:tools="http://schemas.android.com/tools"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical">

    <net.lucode.hackware.magicindicator.MagicIndicator
        android:id="@+id/magic_indicator"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#4c7fc1" />

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/transparent" />

</LinearLayout>
<3.base_frgment_sync_time.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
    <TextView
        android:background="@android:color/transparent"
        android:text="时间同步"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>
<3.下载 magicindicator 将模块添加到项目中,并关联模块.