Magicindicator—ViewPAger的指示器（圆形指示器）

GitHub地址：https://github.com/hackware1993/MagicIndicator

Magicindicator这个框架非常强大，在官方的Demo中已经演示的非常详细了，非常适合用于给ViewPager添加指示器，用起来非常方便。

今天先给大家说说圆形指示器的实现及用法。

这是官方给的三种圆形指示器的形式，接下来让我们依次来实现。

一，首先将项目库以及官方案例导入AndroidStudio

 

二，添加依赖

dependencies {
    compile project(':magicindicator')
}

三，实现圆形指示器

实现圆形指示器的代码在官方的案例都已经实现好了，接下来主要是讲解下如何修改圆形指示器的一些值。

找到案例所在文件CustomNavigatorExampleActivity

 

这是实现圆形指示器的三个方法

private void initMagicIndicator1() {
        MagicIndicator magicIndicator = (MagicIndicator) findViewById(R.id.magic_indicator1);
        CircleNavigator circleNavigator = new CircleNavigator(this);
        circleNavigator.setCircleCount(CHANNELS.length);
        circleNavigator.setCircleColor(Color.RED);
        circleNavigator.setCircleClickListener(new CircleNavigator.OnCircleClickListener() {
            @Override
            public void onClick(int index) {
                mViewPager.setCurrentItem(index);
            }
        });
        magicIndicator.setNavigator(circleNavigator);
        ViewPagerHelper.bind(magicIndicator, mViewPager);
    }

    private void initMagicIndicator2() {
        MagicIndicator magicIndicator = (MagicIndicator) findViewById(R.id.magic_indicator2);
        CircleNavigator circleNavigator = new CircleNavigator(this);
        //设置是否跟着手势动
        circleNavigator.setFollowTouch(false);
        circleNavigator.setCircleCount(CHANNELS.length);
        circleNavigator.setCircleColor(Color.RED);
        circleNavigator.setCircleClickListener(new CircleNavigator.OnCircleClickListener() {
            @Override
            public void onClick(int index) {
                mViewPager.setCurrentItem(index);
            }
        });
        magicIndicator.setNavigator(circleNavigator);
        ViewPagerHelper.bind(magicIndicator, mViewPager);
    }

    private void initMagicIndicator3() {
        MagicIndicator magicIndicator = (MagicIndicator) findViewById(R.id.magic_indicator3);
        ScaleCircleNavigator scaleCircleNavigator = new ScaleCircleNavigator(this);
        scaleCircleNavigator.setCircleCount(CHANNELS.length);
        scaleCircleNavigator.setNormalCircleColor(Color.LTGRAY);
        scaleCircleNavigator.setSelectedCircleColor(Color.DKGRAY);
        scaleCircleNavigator.setCircleClickListener(new ScaleCircleNavigator.OnCircleClickListener() {
            @Override
            public void onClick(int index) {
                mViewPager.setCurrentItem(index);
            }
        });
        magicIndicator.setNavigator(scaleCircleNavigator);
        ViewPagerHelper.bind(magicIndicator, mViewPager);
    }

倒数第一和第二个的主要区别是指示器是否跟着手势动

//设置是否跟着手势动
        circleNavigator.setFollowTouch(false);

接下来就是设置指示器大小和间隔还有颜色了

首先是底下的两种

　　　　　//设置颜色
        circleNavigator.setCircleColor(Color.BLUE);
        //设置指示器间隔
        circleNavigator.setCircleSpacing(20);
        //设置半径
        circleNavigator.setRadius(15);
        //设置边框宽度
        circleNavigator.setStrokeWidth(2);

接下来是第一种

 //设置默认颜色
        scaleCircleNavigator.setNormalCircleColor(Color.BLACK);
        //设置选中颜色
        scaleCircleNavigator.setSelectedCircleColor(Color.GREEN);
        //设置指示器间隔
        scaleCircleNavigator.setCircleSpacing(20);
        //设置默认半径
        scaleCircleNavigator.setMinRadius(8);
        //设置选中半径
        scaleCircleNavigator.setMaxRadius(15);
        //设置跟随手势移动
        scaleCircleNavigator.setFollowTouch(true);