Android自定义View Flyme6的Viewpager指示器

最新更新的Flyme6整体效果不错，动画效果增加了很多了，看了看flyme6的Viewpager指示器，觉得有点意思，就模仿写了一下，整体效果如下：

Gradle

JitPack v1.0.2

allprojects {
 repositories {
  maven { url 'https://jitpack.io' }
 }
}

dependencies {
 compile 'com.github.Dawish:FlymetabStrip:v1.0.2'
}

Attrs

Sample

Demo地址：https://github.com/Dawish/FlymetabStrip/tree/master/samples

代码解释

指示器的动画效果，主要依赖Viewpager的滑动监听器，在Viewpager的滑动过程中不断重绘只是控件就可以实现指示器的位移和缩放动画效果。首先我们讲解一下ViewPager的三个滚动监听方法：

 
 private class PagerStateChangeListener implements onPageChangeListener {

  
  @Override
  public void onPageScrollStateChanged(int state) {
   if (state == ViewPager.SCROLL_STATE_IDLE) { // 0 空闲状态 pager处于空闲状态
    scrollToChild(viewPager.getCurrentItem(), 0);
   }else if(state == ViewPager.SCROLL_STATE_SETTLING){ // 2 正在自动沉降，相当于松手后，pager恢复到一个完整pager的过程

   }else if(state == ViewPager.SCROLL_STATE_DRAGGING){ // 1 viewpager正在被滑动,处于正在拖拽中

   }
  }

  
  @Override
  public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
   currentPosition = position;
   currentPositionOffset = positionOffset;
   // 处理指示器下方横线的滚动,scrollToChild会不断调用ondraw方法，绘制在重绘下划线，这就是移动动画效果
   scrollToChild(position, (int) (positionOffset * container.getChildAt(position).getWidth()));
   invalidate();
  }

  
  @Override
  public void onPageSelected(int position) {
   // 滚动结束后的未知
   selectedPosition = position;
   // 更新指示器状态
   updateTabStyle();
  }

 }

其中最主要的方法就是：

  
  @Override
  public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
   currentPosition = position;
   currentPositionOffset = positionOffset;
   // 处理指示器下方横线的滚动,scrollToChild会不断调用ondraw方法，绘制在重绘下划线，这就是移动动画效果
   scrollToChild(position, (int) (positionOffset * container.getChildAt(position).getWidth()));
   invalidate();
  }

github地址：https://github.com/Dawish/FlymetabStrip

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。