使用属性动画实现进度条效果

参考链接:

http://blog.csdn.net/AndroidMsky/article/details/50239447

最近项目中要做一个显示进度的效果,设计给了我们每个阶段的切图,只要根据数据显示不同的图片就可以了,后来空闲的时候就想着把它做成动态的效果,以前无意间看到上面的文章,正好在这里用到,实现方式比较简单,就三层View,最底层是绿色的View,中间一层是灰色的View,最上层就是一个空心的ImageView,使用属性动画控制中间灰色的View向右平移,最底层绿色就会显示出来,从而实现动态进度条的效果。至于底部的文字,就是 LinearLayout 四等分,在addUpdateListener中获取动画当前的value,动态设置文字的颜色。

代码片段:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
// mProgressMaskView 中间灰色遮罩层View
// mProgressDrawableWidth 进度条的宽度
// state 服务器返回的字段 1、2、3、4,对应每一个阶段
final int state = StringConversionUtil.parseInt(obj.ob_state, 1);
if (mProgressAnimator == null) {
mProgressAnimator = ObjectAnimator.ofFloat(mProgressMaskView, "translationX", 0, mProgressDrawableWidth * state / 4);
mProgressAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
float value = (float) animation.getAnimatedValue();
int index = (int) (value / (mProgressDrawableWidth / 4));
//设置底部文字的颜色
((TextView) mProgressInfoLL.getChildAt(Math.min(index, state - 1))).setTextColor(getResources().getColor(R.color.toolbar_green));
}
});
mProgressAnimator.setDuration(1000);
} else {
mProgressAnimator.setFloatValues(0, mProgressDrawableWidth * state / 4);
}
if (!mProgressAnimator.isRunning()) {
mProgressAnimator.start();
}