扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
前言
成都创新互联提供高防物理服务器租用、云服务器、香港服务器、西部信息服务器托管等
大家应该都知道，圆角按钮是我们在做界面时常常遇到的UI样式。通常的办法，是做一个drawable，比如这样：
<?xml version="1.0" encoding="UTF-8"?>
在Layout文件里Button的background属性设上这个drawable.xml，就可以了。
然而这样做的话，每次弄个按钮都得新做一个drawable文件，各种drawable多了看着就乱。
是不是可以把color和radius放到Button的属性里去，这样就不用每次再拖一个drawable.xml了是吧？
自定义RoundCornerButton
如果可以这样在Layout文件里直接设置背景色和圆角半径，是不是很方便！虽然不如drawable灵活，但是已经足以应付设计同学给出的圆角按钮的需求了。
我们就以定义自己的styleable属性开始吧
从Drawable扩展一个自己的Drawable，很简单
class RoundCornerDrawable extends Drawable {
final int color;
final float radius;
final Paint paint;
final RectF rectF;
RoundCornerDrawable(int color, float radius) {
this.color = color;
this.radius = radius;
// 实心的画笔
this.paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setAntiAlias(true);
paint.setColor(color);
this.rectF = new RectF();
}
// 用于设置Drawable宽高
public void setRect(int width, int height) {
this.rectF.left = 0;
this.rectF.top = 0;
this.rectF.right = width;
this.rectF.bottom = height;
}
@Override
public void draw(@NonNull Canvas canvas) {
canvas.drawRoundRect(rectF, radius, radius, paint); // 画圆角矩形，现成的方法
}
// 其余方法略
}定义自己的Button类，有这么几个要点：
public class RoundCornerButton extends AppCompatButton {
private int colorNormal;
private float cornerRadius;
private RoundCornerDrawable bgDrawableNormal = null;
// 省略三个构造方法
// 构造方法最后一定要调用initCornerBackground完成初始化
private void initCornerBackground(AttributeSet attrs, int defStyleAttr) {
TypedArray a = getContext().obtainStyledAttributes(attrs, R.styleable.RoundCornerButton, defStyleAttr, 0);
this.cornerRadius = a.getDimension(R.styleable.RoundCornerButton_rcb_cornerRadius, 0);
this.colorNormal = a.getColor(R.styleable.RoundCornerButton_rcb_backgroundColor, 0);
makeBackgroundDrawable();
a.recycle();
}
private void makeBackgroundDrawable() {
bgDrawableNormal = new RoundCornerDrawable(this.colorNormal, this.cornerRadius);
bgDrawableNormal.setRect(getWidth(), getHeight());
// 设计通常会给出禁用时的样式以及按下时的样式
// 所以这里用使用StateListDrawable
StateListDrawable bgDrawable = new StateListDrawable();
bgDrawable.addState(new int[]{android.R.attr.state_enabled, -android.R.attr.state_pressed}, bgDrawableNormal);
// 每多一种状态，在这里多加一项
setBackgroundDrawable(bgDrawable);
}
@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
// layout之后必然会draw，所以在这里设置drawable的尺寸
if (bgDrawableNormal != null) {
bgDrawableNormal.setRect(right - left, bottom - top);
}
// 每多一种状态，在这里多加一项
}
}附上Demo源代码：https://github.com/realxu/CodeSamples/tree/master/Android/RoundCornerButtonDemo
这就可以啦，我们看看效果：
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对创新互联的支持。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
微信二维码
移动版官网