Android ViewPagerIndicator小圆点效果实现

1,实现效果 

  • 默认效果 

 

  • 通过属性更改

 

 

【1】ViewPagerIndicator项目导入

* 自己项目下添加依赖

compile 'com.github.JakeWharton:ViewPagerIndicator:2.4.1'

* 整体项目添加 maven

allprojects {

    repositories {

        jcenter()

        mavenCentral()

        maven { url "https://jitpack.io" }

    }

}

2,实现逻辑 

【1】布局中添加

    

  • app:strokeWidth 是圆点之间的距离

  • app:radius="3dp"  的大小

  • app:strokeColor="#FF000000" 圆点的颜色

  • app:pageColor="#888888" 背景颜色

  • app:fillColor="#FF0000" 充满的颜色









    

        

        

            

            

        

    





 

【3】找到控件

public CirclePageIndicator mIndicator;// 小圆点

 

【4】设置圆点        

    // viewpager和小圆点关联

            mIndicator.setViewPager(mVp);

            mIndicator.setSnap(true);// 取消圆点的跟随手指滑动效果

            // mIndicator.setCurrentItem(0);// 0的时候 如果设置了setSnap(true) 会不触发监听

            // 让小圆点默认显示在第0个

            mIndicator.onPageSelected(0);

【5】更新标题      

     mIndicator.setOnPageChangeListener(new OnPageChangeListener() {

                @Override

                public void onPageSelected(int position) {

                    TopNewsInfo topNewsInfo = topnews.get(position);

                    // 更新小标题

                    tvTitle.setText(topNewsInfo.title);

                }

                @Override

                public void onPageScrolled(int position, float positionOffset,

                        int positionOffsetPixels) {

                }

                @Override

                public void onPageScrollStateChanged(int state) {





                }

            });
  •  

 

 

 

你可能感兴趣的:(Android)