android中MagicIndicator的基本用法

在项目和产品的开发过程中难免会遇到使用viewpager+指示器的UI实现,之前都是自己写来实现,麻烦不说代码量也比较多,之前也想过自己抽出来封装一个框架来处理,但是在后来发现MagicIndicator这个框架挺好用的,方法简单效果比较全面,然后就用了这个,下面大概介绍一下MagicIndicator的基本用法
第一步首先就是引用这个框架,在build.gradle中添加引用
compile'com.github.hackware1993:MagicIndicator:1.5.0'
第二步在使用的页面布局文件中添加代码

<net.lucode.hackware.magicindicator.MagicIndicator
    android:id="@+id/magic_indicator"
    android:layout_width="match_parent"
    android:layout_height="45dp" />
<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_weight="1"
    android:layout_width="match_parent"
    android:layout_height="0dp">
</android.support.v4.view.ViewPager>

在通过在view页面初始化控件并设置控件属性

@BindView(R.id.magic_indicator)
MagicIndicator magicIndicator;
@BindView(R.id.viewpager)
ViewPager viewPager;

设置标题的指示器样式

CommonNavigator commonNavigator = new CommonNavigator(getActivity());
 commonNavigator.setAdapter(new CommonNavigatorAdapter() {
        @Override
        public int getCount() {
            return titles.length;
        }
        @Override
        public IPagerTitleView getTitleView(Context context, final int index) {
            SimplePagerTitleView simplePagerTitleView = new ScaleTransitionPagerTitleView(context);
            simplePagerTitleView.setText(titles[index]);
            simplePagerTitleView.setTextSize(20);//设置导航的文字大小
            simplePagerTitleView.setNormalColor(Color.GRAY);//正常状态下的标题颜色
            simplePagerTitleView.setSelectedColor(getResources().getColor(R.color.title_bar_bg));//选中的标题字体颜色
            simplePagerTitleView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    viewPager.setCurrentItem(index);
                }
            });
            return simplePagerTitleView;
        }
        @Override
        public IPagerIndicator getIndicator(Context context) {
            return null;
        }
    });
    magicIndicator.setNavigator(commonNavigator);

最后需要将viewpager与MagicIndicator 绑定到一起
ViewPagerHelper.bind(magicIndicator, viewPager);
这样基础的用法就搞定了效果如下图


Screenshot_20180427-150202.jpg
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,826评论 25 709
  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明AI阅读 16,020评论 3 119
  • 杨绛说:“迷茫是因为你读的书太少却想的太多”。 最近赶上毕业季,我的实习生面临着转正,跟我的实习生进行了一次深入的...
    Jewel_Z阅读 641评论 0 3
  • 前言: 对于使用oc的同学来说一定十分熟悉AFNetworking这个框架,因为现在我们的app只要是有关于网络访...
    480a52903ce5阅读 642评论 0 1
  • 小剧场3 萧璇对许多东西过敏,比如,她不能碰猫毛,甚至也不能接触碰过猫的人,再比如,她不能吃芒果,吃过五分钟...
    环形木阅读 238评论 1 1