Android滾動頁面位置指示器：CircleIndicator



Android滾動頁面位置指示器：CircleIndicator

CircleIndicator是github上的一個開源的用於頁面滾動時候的位置指示器，指示當前頁面在總的頁面中的位置和前后位置關系，github上的項目主頁是：https://github.com/ongakuer/CircleIndicator

其效果如圖所示：

可以看到，選中和未被選中時候的球的大小並不相同，且顏色在CircleIndicator中只有一個顏色，未選中的顏色只是選中時候顏色的半透明。但是在有些設計需求中，設計會把滾動的指示小圓球都要求一樣的大小，且在滾動指示位置變化時候，需要用不同的顏色區分。這種情況下，就需要對CircleIndicator進行二次開發以適應自身項目的設計需要。針對這種情況，我對CircleIndicator進行了二次開發，實現的結果如圖：

（1） 指示器顏色區分。
首先需要在res/drawable下面定義兩個不同的shape資源文件。一個用於當前被選中的那個小球位置。另外一個用於未被選中的位置顯示的shape資源。然后修改CircleIndicator.java代碼中的部分節：

private int mIndicatorBackgroundResId = R.drawable.red_radius;
    private int mIndicatorUnselectedBackgroundResId = R.drawable.white_radius;

mIndicatorBackgroundResId =
                typedArray.getResourceId(R.styleable.CircleIndicator_ci_drawable,
                        R.drawable.red_radius);
        mIndicatorUnselectedBackgroundResId =
                typedArray.getResourceId(R.styleable.CircleIndicator_ci_drawable_unselected,
                        R.drawable.white_radius);

（2） CircleIndicator圓球一致相同。
CircleIndicator原先項目中之所以會出現選中與未選中的小球大小不一致，是因為CircleIndicator在項目中在位置變化 時候對小圓球進行動畫縮放，修改res/animator下的scale_with_alpha.xml文件中關於縮放的設置，簡單期間，縮放的值設置成1.0~1.0（即維持原大小不縮放）。

新的CircleIndicator庫我已經修改好代碼，運行結果如圖中底部中間位置的三個不同顏色的小球：

我把心的庫重新push到新的github主頁，鏈接地址：https://github.com/zhangphil/CircleIndicator_Phil
使用時候直接作為庫引入即可。

附錄：
1，《ViewPager實現TabHost動態添加、刪除Fragment，用紅色小圓球指示當前頁面》鏈接：http://blog.csdn.net/zhangphil/article/details/43668197
2，《ViewPager動態添加、刪除Fragment，且提供紅色小圓球指示當前位置》鏈接：http://blog.csdn.net/zhangphil/article/details/43671293
3，《ViewPager+Fragment實現Tabhost，動態添加刪除Fragment，可供第三方使用的類庫》鏈接：http://blog.csdn.net/zhangphil/article/details/43700807
4，《ViewPager+Fragment添加一行若干小紅球滾動指示器指示當前ViewPager翻閱位置（可供第三方使用的類）》鏈接：http://blog.csdn.net/zhangphil/article/details/43732039