android简单的自定义按钮,Android自定义一个简单的登录按钮

无图言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);//画圆内的线条

是不是很简单！展开的动画其实一个道理，有兴趣的可以自己写写看！