前言
在开发AndroidUI时,如果想要做出自己想要的特定的外观效果,就不可能只依赖Android原生组件,虽然说随着Android的版本更迭其原生组件的美观度有了很大的提升,但是对于一个完整的App来说,它们很难与我们想要的整体效果保持一致,所以这个时候我们就需要自定义组件来实现特定的效果。
本文将介绍实现基本的自定义组件的方法,并完成一个自定义的EditText做为示例。
自定义组件基本步骤
-
继承View的子类
在AndroidUI中,所有的布局、组件等界面元素都是继承自View类,这个类定义了一个界面元素的标准行为,包括确定位置,确定尺寸,绘制外观样式等,当我们自定义组件时,就需要重写onMeasure,onLayout,onDraw方法。当我们需要的组件与原生组件的功能相似时,我们可以直接继承自具体的View的子类,如ImageButton,当我们需要完全重新定义一个组件时,需要做的工作就比较多,这时就需要继承View或ViewGroup。本文暂时只讨论前者。
-
为自定义View添加属性
这里的属性是指配置UI组件时的属性,我们在自定义组件时,原生View的属性往往不能满足我们的配置需求,我们可能需要一些更多样化或更精确的控制,这时我们就需要为View添加属性,这样我们定义的组件就会变的通用。
-
编写代码覆盖View中的绘制方法
即覆盖View中的onMeasure,onLayout,onDraw等方法。
-
自定义事件响应方法和部分回调方法
onFinishInflate() 回调方法,当应用从XML加载该组件并用它构建界面之后调用的方法
onMeasure() 检测View组件及其子组件的大小
onLayout() 当该组件需要分配其子组件的位置、大小时
onSizeChange() 当该组件的大小被改变时
onDraw() 当组件将要绘制它的内容时
onKeyDown 当按下某个键盘时
onKeyUp 当松开某个键盘时
onTouchEvent 当发生触屏事件时
onWindowFocusChanged(boolean) 当该组件得到、失去焦点时
onAtrrachedToWindow() 当把该组件放入到某个窗口时
onDetachedFromWindow() 当把该组件从某个窗口上分离时触发的方法
onWindowVisibilityChanged(int): 当包含该组件的窗口的可见性发生改变时触发的方法
自定义Edittext示例
本例的目的不在于创建一个十分美观的组件,主要是为了通过一个简单的示例说明上述内容的具体实现方法,帮助大家理解自定义组件的基本原理和方法。明白了基本的自定义组件实现方法,创建出炫酷的组件还会远吗?
-
右下角字数统计
由于要在下划线下显示字数统计,所以下划线的绘制位置要修改到字的上端。另外,由于字数统计的存在,还需要增加EditText的bottom padding,把字显示在多出来的这块padding上。
-
自定义属性
设置了一个自定义属性lineColor,用于设置下划线颜色,可以在xml布局文件中直接进行设置。
-
效果图
-
示例代码
MyEditText.java
public class MyEditText extends EditText {
// 画下划线的画笔
private Paint paint;
// 绘制计数的画笔
private TextPaint textPaint;
// 下划线的开始y坐标
private int lineY;
// 下划线的颜色
private int lineColor;
// 当前输入的字符数
private int count;
// 用来获取计数结果的字符串
private StringBuffer countString;
public MyEditText(Context context, AttributeSet attrs) {
super(context, attrs);
init(attrs);
}
public MyEditText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(attrs);
}
private void init(AttributeSet attrs) {
TypedArray array = getContext().obtainStyledAttributes(attrs, R.styleable.MyEditText);
lineColor = array.getColor(R.styleable.MyEditText_lineColor, Color.BLUE);
array.recycle();
countString = new StringBuffer();
super.setHintTextColor(Color.LTGRAY);
// 初始化下划线画笔
paint = new Paint();
paint.setColor(lineColor);
paint.setAntiAlias(true);
paint.setStrokeWidth(2);
paint.setStyle(Paint.Style.FILL_AND_STROKE);
paint.setStrokeCap(Paint.Cap.ROUND);
// 初始化字符计数的画笔
textPaint = new TextPaint(Paint.ANTI_ALIAS_FLAG);
textPaint.setTextSize(40);
textPaint.setColor(Color.LTGRAY);
super.setPadding(getPaddingLeft(),getPaddingTop(),getPaddingRight(),getPaddingBottom()+70);
addListener();
}
private void addListener() {
addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {}
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {}
@Override
public void afterTextChanged(Editable s) {
countString.delete(0, countString.length());
count = s.length();
countString.append(count);
countString.append("字");
}
});
}
@Override
protected void onDraw(Canvas canvas) {
// 下划线的高度
lineY = getScrollY()+getHeight()-getPaddingBottom()+5;
// 绘制下划线
canvas.drawRect(getScrollX(), lineY, getScrollX()+getWidth()-getPaddingRight(), lineY, paint);
// 绘制右下角的计数
canvas.drawText(countString.toString(), getScrollX()+getWidth()-getPaddingRight() - textPaint.measureText(countString.toString()), lineY + 60, textPaint);
super.onDraw(canvas);
}
}
res/values/attrs.xml
activity_main.xml