无图言diao！
1.gif
一个简单的效果，点击登录按钮，整个按钮向中间缩进并且成圆形progressbar。
强调一点，在View中重写的onDraw(Canvas canvas)方法中千万不要有new这个操作！
实现原理，就是画一个圆角矩形canvas.drawRoundRect(RectF rect, float rx, float ry, Paint paint)，通过动画不停的改变RectF的宽度值来产生缩进效果，来一段代码压压惊；
//width / 2 - height / 2 这个是整个矩形向中心移动的距离
move = ValueAnimator.ofInt(0, width / 2 - height / 2);
move.setDuration(1000);
move.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
distance = (int) valueAnimator.getAnimatedValue();//获取改变的值 来改变圆角矩形的大小
invalidate();//通知view去重绘
}
});
move.start();
canvas.drawRoundRect(new RectF(distance, 0, width - distance, height), circle, circle, paint);
这两端代码就可以达到缩进动画的效果了；接下来是progressbar：
//在缩进动画完成后开始旋转progressbar
move.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animator) {
}
@Override
public void onAnimationEnd(Animator animator) {
rotate = ValueAnimator.ofInt(0,360);//0到360度旋转
rotate .setInterpolator(new LinearInterpolator());//线型插值器
rotate.setDuration(500);
rotate.setRepeatCount(Animation.INFINITE);//设置重复
rotate.setRepeatMode(ValueAnimator.RESTART);//设置重复模式
rotate.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
rValue = (int) valueAnimator.getAnimatedValue();//获取值
invalidate();//重新开始绘制
}
});
rotate.start();
}
});
canvas.rotate(rav, width / 2, height / 2);//旋转画布来实现转圈的效果
canvas.drawCircle(width/2,height/2,circle,paint);//画圆
canvas.drawArc(new RectF(width / 2 - circle + 20, 20, width / 2 + circle - 20, height - 20), 0, 140, false, paint1);//画圆内的线条
是不是很简单！展开的动画其实一个道理，有兴趣的可以自己写写看！
