【Android Kotlin】自定义可清除内容EditText

本文介绍如何使用Kotlin实现一个带有清除按钮的自定义EditText组件。通过监听输入框内容的变化来动态显示或隐藏清除图标,并实现了触摸事件以清空输入框。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前言

前面四篇文章已经介绍了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、监听输入框内容变化

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()
        
        //获取EditText右Padding值
        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宽度之间即可。

这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值