尊重劳动者创作，转发请注明出处
首先看本文实现的效果。
一个自定义 EditText 实现了删除、密码明文切换功能。老实说 Android 已经为我们提供了很多可供直接使用的组件，比如：TextView、EditText、ListView 等。现实中原生组件往往都是丑陋拿不出手的，为了提高用户体验往往需要我们对原生控件进行强化。
首先什么是 EditText，我们看看官方的解释：
EditText is a thin veneer over TextView that configures itself to be editable.
This is supposed to be a very thin veneer over TextView.Do not make any changes here that do anything that a TextView with a key listener and a movement method wouldn't do!
简单来说 EditText 是继承 TextView 且具有编辑功能的一个组件，从 UI 上看 EditText 就是一个输入框支持手机号、邮箱、文本、密码等常用格式。
上面已经对 EditText 进行了了解，下面我们进入今天的主题 EditTextS。 EditTextS 从名字上看顾名思义这是 EditText 的加强版，对，没有错，这是基于 EditText 进行的拓展，在 EditText 的基础上新增了点击右侧清除图标进行文本框的清空，也可在此基础上 xml 文件中加上app:is_pwd="true"即可实现点击右侧图标密码明文的切换（两种方式的切换只需一行代码）。
1>我们看下如何初始化组件的属性
public EditTextS(Context context) { super(context); initView(null); }
public EditTextS(Context context, AttributeSet attrs) { super(context, attrs); initView(attrs); }
public EditTextS(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); initView(attrs); }
private void initView(AttributeSet attrs) {
if (attrs == null)
return;
/** 清空密码模式*/
if (pwdModel(attrs))
return;
/** 清空文本模式 */
clearTextModel();
}
细心的同学一定会发现每个构造方法中都调用了 initView(xxx) 函数，顾名思义对于继承控件（EditTextS 继承了 EditText），属性的初始化都是在构造方法中完成的。下面继续看：
private boolean pwdModel(AttributeSet attrs) {
mIsPwdModel = getContext().obtainStyledAttributes(attrs, EditTextS_RES).getBoolean(R.styleable.EditTextS_RES_is_pwd, false);
if (mIsPwdModel) {
mRightIcon = getContext().getResources().getDrawable(R.drawable.browse);
setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD);
setCompoundDrawablesWithIntrinsicBounds(null, null, mRightIcon, null);
setCompoundDrawablePadding(mDrawablePadding);
return true;
}
return false;
}
private void clearTextModel() {
mRightIcon = getContext().getResources().getDrawable(R.mipmap.delete);
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) {
iniDelIcon();
}
});
iniDelIcon();
}
private void iniDelIcon() {
if (length() < 1)
setCompoundDrawablesWithIntrinsicBounds(null, null, null, null);
else
setIcon(mRightIcon);
}
这里 pwdModel() 函数主要是对密码模式的一个逻辑处理 clearTextModel() 函数是对清空文本框的一个处理。
- pwdModel：主要对右侧密码图标的初始化以及图标 padding 控制。
- clearTextModel：主要对右侧删除图标的初始化和padding 控制。
到这里一些自定义 view 已经完成了一小半，下面我们加上点击事件，来完成收尾工作。
/** 图标事件处理 */
@Override
public boolean onTouchEvent(MotionEvent event) {
int eventX = (int) event.getRawX();
int eventY = (int) event.getRawY();
Rect rect = new Rect();
getGlobalVisibleRect(rect);
// "-55" 用来调整点击图标的坐标，图标过大或过小可以微调此值
rect.left = rect.right - 38;
// 密码模式
if (mIsPwdModel && event.getAction() == MotionEvent.ACTION_UP && rect.contains(eventX, eventY)) {
if (eyeIsClick == true) {
setIcon(getContext().getResources().getDrawable(R.drawable.edit));
setInputType(InputType.TYPE_CLASS_TEXT);
eyeIsClick = false;
} else {
this.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD);
setIcon(getContext().getResources().getDrawable(R.drawable.browse));
eyeIsClick = true;
} setSelection(getText().length());
// 清空模式
} else {
if (event.getAction() == MotionEvent.ACTION_UP && rect.contains(eventX, eventY)) {
// Log.e(EditTextS.class.getSimpleName(), "l= " + rect.left + "; r= " + rect.right);
setText("");
}
}
return super.onTouchEvent(event);
}
private void setIcon(Drawable mDeleIcon) {
setCompoundDrawablesWithIntrinsicBounds(null, null, mDeleIcon, null);
setCompoundDrawablePadding(mDrawablePadding);
}
到这里核心代码已经完全贴出，onTouchEvent() 函数主要是对用户触摸屏幕的区域、触摸的状态 输入框的模式进行不同的处理，代码里面都有注释 一步一步分析，没有什么很难的东西，最后放出动态图，看效果。
图片里上面两个是同一个控件，唯一的区别就是一行代码的区别，具体可以参考 demo 进行编写，好意见欢迎提出。
OK，自定义 View 介绍完了，了解到自定义控件实现有三种方式，分别是：组合控件、自绘控件和继承控件。这只是其中一种实现方式，后续有时间我会持续进行更新，喜欢就关注，帅比杨不只帅还有才华。
ps: 有帮助的话: 喜欢、评论、转发，动一动你的小手让更多的人知道！关注 帅比-杨。
