前言
前面四篇文章已经介绍了Kotlin的一些基础内容。这篇将使用Kotlin实现一个简单的自定义View,可清除内容的输入框AutoClearEditText。
实现思路
1.自定义AutoClearEditText继承EditText
class AutoClearEditText(context: Context, attr: AttributeSet) : EditText(context, attr) {
}
因为该自定义的控件要在XML布局文件中使用,所以使用具有两个参数的构造函数,这里使用的是主构造函数。
2.初始化数据
前面的文章介绍了在Kotlin中进入页面或者实例化此类的时候需要初始化一些数据,Java中可以在构造函数初始化,Kotlin的构造函数不能有任何的代码,通过init关键字。
private var rightClearDrawable: Drawable? = null
private var drawable: Drawable? = null
init {
/*获取删除按钮图片的Drawable对象*/
drawable = ContextCompat.getDrawable(context, R.mipmap.delete)
/*设置图片的范围*/
drawable!!.setBounds(0, 0, drawable!!.minimumWidth, drawable!!.minimumHeight)
/*设置EditText和删除按钮图片的间距*/
compoundDrawablePadding = context.resources.getDimensionPixelSize(R.dimen.dp5)
/*输入框内容监听*/
addTextChangedListener(TextWatchImpl())
/*设置是否显示删除按钮*/
setHideRightClearDrawable(false)
}
private fun setHideRightClearDrawable(isVisible: Boolean) {
/*是否显示删除按钮*/
rightClearDrawable = if (isVisible) {
drawable
} else {
null
}
/*给EditText左,上,右,下设置图片*/
this.setCompoundDrawables(compoundDrawables[0], compoundDrawables[1], rightClearDrawable, compoundDrawables[3])
}
3.监听输入框内容变化
/*这里使用inner表示内部类*/
private inner class TextWatchImpl : TextWatcher {
override fun beforeTextChanged(charSequence: CharSequence, i: Int, i1: Int, i2: Int) {
}
override fun onTextChanged(charSequence: CharSequence, i: Int, i1: Int, i2: Int) {
}
override fun afterTextChanged(editable: Editable) {
/*判断输入框有没有内容,设置是否显示删除按钮*/
if ("" != text.toString().trim { it <= ' ' } && text.toString().trim { it <= ' ' }.isNotEmpty()) {
setHideRightClearDrawable(true)
} else {
setHideRightClearDrawable(false)
}
}
}
4.点击删除按钮
override fun onTouchEvent(event: MotionEvent): Boolean {
/*判断手指按下的x坐标*/
val x = event.x
/*获取自定义EditText宽度*/
val width = this@AutoClearEditText.width.toFloat()
/*获取EditText右Padding值*/
val totalPaddingRight = this@AutoClearEditText.totalPaddingRight.toFloat()
/*判断手指按下的区域是否在删除按钮宽高范围内*/
if (event.action == MotionEvent.ACTION_UP) {
if (x > width - totalPaddingRight && x < width && event.y < this@AutoClearEditText.height) {
this@AutoClearEditText.setText("")
}
}
return super.onTouchEvent(event)
}
这里通过this@ ,这个表达式,在内部类中获取外部类的对象。
自定义AutoClearEditText 效果图。上述计算点击删除按钮区域的逻辑在EidtText总长度 - 总的右Padding值和EditText宽度之间即可。