以前在项目中使用线性布局实现该效果，感觉操作很繁琐而且很不利于复用，于是封装了一个简单的指示器类。 这是一个非常简单的ViewPager页码指示器，实现方式只有一个继承View的自定义View。
IndicatorView主要使用场景如下：
- 引导页页码指示
- 轮播图页码指示
IndicatorView的优点:
- 很轻量级：继承自View
- 样式定制性高：通过StateListDrawable（即XML）配置选择图形，支持使用图片的默认宽高
- 自定义动画：通过实现IndicatorTransformer接口实现切换动画，内置平移动画TranslationIndicatorTransformer
使用Android Studio
在build.gradle中添加如下代码：
dependencies {
compile 'cn.junhua.android.view:indicatorviewlibrary:1.2.1'
}
出现依赖冲突可以剔除内部依赖的v4包：
implementation ('cn.junhua.android.view:indicatorviewlibrary:1.2.0'){
exclude module: 'support-v4'
}
<cn.junhua.android.view.IndicatorView
android:id="@+id/indicator_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>这是最简单的使用方法，默认样式如下图：
IndicatorView支持的自定义属性如下：
<declare-styleable name="IndicatorView">
<!-- 设置指示器显示的总个数 -->
<attr name="indicator_count" format="integer" />
<!-- 指示器绘图的默认颜色 -->
<attr name="indicator_color" format="reference|color" />
<!-- 指示器绘图的select形式，会覆盖indicator_color设置的值-->
<attr name="indicator_drawable" format="reference" />
<!-- 指示器绘图的半径 -->
<attr name="indicator_radius" format="reference|dimension" />
<!-- 指示器绘图的选中时放缩比例 -->
<attr name="indicator_select_scale" format="float" />
<!-- 指示器默认选中的单元 -->
<attr name="indicator_select" format="integer" />
<!-- 指示器单元的宽高 优先级高于绘图的半径-->
<attr name="indicator_unit_width" format="reference|dimension" />
<attr name="indicator_unit_height" format="reference|dimension" />
<!-- 指示器单元之间的间距 -->
<attr name="indicator_padding" format="reference|dimension" />
</declare-styleable>例如indicator_drawable属性支持StateListDrawable类型选择器，IndicatorView会根据不同的条件展示不同的图形。 支持如下几对的触发条件：
- state_selected
- state_pressed
- state_checked
- state_enabled
使用方式：
indicator_unit_select1.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false">
<shape android:shape="oval">
<solid android:color="#ff0000" />
</shape>
</item>
<item android:state_pressed="true">
<shape android:shape="oval">
<stroke android:width="1dp" android:color="#ff0000" />
</shape>
</item>
</selector>布局文件
<cn.junhua.android.view.IndicatorView
android:id="@+id/indicator_view1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
app:indicator_count="9"
app:indicator_drawable="@drawable/indicator_unit_select1"
app:indicator_select="0" />关联操作：
IndicatorView indicator_view = (IndicatorView) findViewById(R.id.indicator_view);
indicator_view.setCount(resList.size());
//关联ViewPager
indicator_view.setupWithViewPager(viewpager);
//或者使用
indicator_view.setSelect(int pos);使用动画：
private class ScaleIndicatorTransformer extends IndicatorView.TranslationIndicatorTransformer {
@Override
public void transformPage(IndicatorView page, Canvas canvas, int position, float positionOffset) {
super.transformPage(page, canvas, position, positionOffset);
Log.d(TAG, "transformPage() called with: position = [" + position + "], positionOffset = [" + positionOffset + "]");
Rect bounds = page.getUnitBounds();
float pos = Math.abs(positionOffset - 0.5f) * 2;
pos = pos < 0.4f ? 0.4f : pos;
canvas.scale(pos, pos, bounds.centerX(), bounds.centerY());
}
}
indicator_view.setIndicatorTransformer(new ScaleIndicatorTransformer());
//或者使用内置平移动画
indicator_view.setIndicatorTransformer(new IndicatorView.TranslationIndicatorTransformer());不同的选择效果都可以通过不同的选择器得到。
欢迎Pull Requests 和 Issues。
下步更新计划：
- 在同一个指示器中支持同时显示不同StateListDrawable