介绍：

可定制、易扩展的 ViewPager 指示器框架。轻轻松松打造各式各样的指示效果。支持角标功能，可将任意的 View 设置成角标。支持在非ViewPager场景下使用（使用hide()、show()切换Fragment），兼容 Android 2.3+。

运行效果：

使用说明：

1. checkout out MagicIndicator

2. 导入magicindicator module 并添加依赖：

   compile project(':magicindicator')
   

   或者

   repositories {
       ...
       maven {
           url "https://jitpack.io"
       }
   }
   dependencies {
       ...
       compile 'com.github.hackware1993:MagicIndicator:1.3.1'
   }
   

3. 添加MagicIndicator到layout 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"
       tools:context="net.lucode.hackware.magicindicatordemo.MainActivity">
       <net.lucode.hackware.magicindicator.MagicIndicator
           android:id="@+id/magic_indicator"
           android:layout_width="match_parent"
           android:layout_height="40dp" />
       <android.support.v4.view.ViewPager
           android:id="@+id/view_pager"
           android:layout_width="match_parent"
           android:layout_height="0dp"
           android:layout_weight="1" />
   </LinearLayout>
   

4. 初始化MagicIndicator：

   MagicIndicator magicIndicator = (MagicIndicator) findViewById(R.id.magic_indicator);
   CommonNavigator commonNavigator = new CommonNavigator(this);
   commonNavigator.setAdapter(new CommonNavigatorAdapter() {
       @Override
       public int getCount() {
           return mTitleDataList == null ? 0 : mTitleDataList.size();
       }
       @Override
       public IPagerTitleView getTitleView(Context context, final int index) {
           ColorTransitionPagerTitleView colorTransitionPagerTitleView = new ColorTransitionPagerTitleView(context);
           colorTransitionPagerTitleView.setNormalColor(Color.GRAY);
           colorTransitionPagerTitleView.setSelectedColor(Color.BLACK);
           colorTransitionPagerTitleView.setText(mTitleDataList.get(index));
           colorTransitionPagerTitleView.setOnClickListener(new View.OnClickListener() {
               @Override
               public void onClick(View view) {
                   mViewPager.setCurrentItem(index);
               }
           });
           return colorTransitionPagerTitleView;
       }
       @Override
       public IPagerIndicator getIndicator(Context context) {
           LinePagerIndicator indicator = new LinePagerIndicator(context);
           indicator.setMode(LinePagerIndicator.MODE_WRAP_CONTENT);
           return indicator;
       }
   });
   magicIndicator.setNavigator(commonNavigator);
   

5. 和ViewPager一起使用:

   ViewPagerHelper.bind(magicIndicator, mViewPager);
   

   或者

   和Fragment容器一起使用(通过Fragment的 hide()、show()切换):

   mFramentContainerHelper = new FragmentContainerHelper(magicIndicator);
   ...
   mFragmentContainerHelper.handlePageSelected(pageIndex);   // invoke when switch Fragment
   

Extend

MagicIndicator可以轻易的被扩展:

1. 实现IPagerTitleView以自定义tab:

   public class MyPagerTitleView extends View implements IPagerTitleView {
       public MyPagerTitleView(Context context) {
           super(context);
       }
       @Override
       public void onLeave(int index, int totalCount, float leavePercent, boolean leftToRight) {
       }
       @Override
       public void onEnter(int index, int totalCount, float enterPercent, boolean leftToRight) {
       }
       @Override
       public void onSelected(int index, int totalCount) {
       }
       @Override
       public void onDeselected(int index, int totalCount) {
       }
   }
   

2. 实现IPagerIndicator以自定义indicator:

   public class MyPagerIndicator extends View implements IPagerIndicator {
       public MyPagerIndicator(Context context) {
           super(context);
       }
       @Override
       public void onPageSelected(int position) {
       }
       @Override
       public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
       }
       @Override
       public void onPageScrollStateChanged(int state) {
       }
       @Override
       public void onPositionDataProvide(List<PositionData> dataList) {
       }
   }
   

3. 使用CommonPagerTitleView加载自定义layout xml.