最新更新的Flyme6整體效果不錯，動畫效果增加了很多了，看了看flyme6的Viewpager指示器，覺得有點意思，就模仿寫了一下，整體效果如下：
成都創(chuàng)新互聯(lián)從2013年開始，先為青白江等服務建站，青白江等地企業(yè)，進行企業(yè)商務咨詢服務。為青白江企業(yè)網(wǎng)站制作PC+手機+微官網(wǎng)三網(wǎng)同步一站式服務解決您的所有建站問題。
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的滑動監(jiān)聽器，在Viewpager的滑動過程中不斷重繪只是控件就可以實現(xiàn)指示器的位移和縮放動畫效果。首先我們講解一下ViewPager的三個滾動監(jiān)聽方法：
/**
* viewPager狀態(tài)改變監(jiān)聽
*
*/
private class PagerStateChangeListener implements OnPageChangeListener {
/**
* viewpager狀態(tài)監(jiān)聽
* @param state
*/
@Override
public void onPageScrollStateChanged(int state) {
if (state == ViewPager.SCROLL_STATE_IDLE) { // 0 空閑狀態(tài) pager處于空閑狀態(tài)
scrollToChild(viewPager.getCurrentItem(), 0);
}else if(state == ViewPager.SCROLL_STATE_SETTLING){ // 2 正在自動沉降，相當于松手后，pager恢復到一個完整pager的過程
}else if(state == ViewPager.SCROLL_STATE_DRAGGING){ // 1 viewpager正在被滑動,處于正在拖拽中
}
}
/**
* viewpager正在滑動，會回調(diào)一些偏移量
* 滾動時，只要處理指示器下方橫線的滾動
* @param position 當前頁面
* @param positionOffset 當前頁面偏移的百分比
* @param positionOffsetPixels 當前頁面偏移的像素值
*/
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
currentPosition = position;
currentPositionOffset = positionOffset;
// 處理指示器下方橫線的滾動,scrollToChild會不斷調(diào)用ondraw方法，繪制在重繪下劃線，這就是移動動畫效果
scrollToChild(position, (int) (positionOffset * container.getChildAt(position).getWidth()));
invalidate();
}
/**
* page滾動結(jié)束
* @param position 滾動結(jié)束后選中的頁面
*/
@Override
public void onPageSelected(int position) {
// 滾動結(jié)束后的未知
selectedPosition = position;
// 更新指示器狀態(tài)
updateTabStyle();
}
}
其中最主要的方法就是：
/**
* viewpager正在滑動，會回調(diào)一些偏移量
* 滾動時，只要處理指示器下方橫線的滾動
* @param position 當前頁面
* @param positionOffset 當前頁面偏移的百分比
* @param positionOffsetPixels 當前頁面偏移的像素值
*/
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
currentPosition = position;
currentPositionOffset = positionOffset;
// 處理指示器下方橫線的滾動,scrollToChild會不斷調(diào)用ondraw方法，繪制在重繪下劃線，這就是移動動畫效果
scrollToChild(position, (int) (positionOffset * container.getChildAt(position).getWidth()));
invalidate();
}
github地址：https://github.com/Dawish/FlymeTabStrip
以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。
