自定义editText清除按钮答案

【问题标题】：Custom editText clear button自定义editText清除按钮
【发布时间】：2018-09-17 20:25:21
【问题描述】：

我有一个自定义的editText，我想在其中实例化一个充当清除按钮的drawable，当用户在editText上书写时，会出现清除图标，如果单击它，它会清除editText上的文本。但是如果用户在图标未实例化时点击了editText，则会引发空指针异常。

代码如下：

class EditTextClearCross : AppCompatEditText, View.OnTouchListener {

    private lateinit var  mClearButtonImage: Drawable

    constructor(context: Context) : super(context){
        setupButton()
    }

    constructor(context: Context, attrs: AttributeSet) : super(context,attrs) {
        setupButton()
    }

    constructor(context: Context, attrs: AttributeSet, defStyle: Int) : super(context,attrs,defStyle) {
        setupButton()
    }

    private fun setupButton() {
        mClearButtonImage = ResourcesCompat.getDrawable(resources, R.drawable.ic_cancel_opaque_14dp, null)!!


        //setCompoundDrawablesRelativeWithIntrinsicBounds(null, null, mClearButtonImage, null)

        addTextChangedListener(object : TextWatcher {
            override fun afterTextChanged(s: Editable?) {
                if (s?.isEmpty()!!) {
                    setCompoundDrawablesRelativeWithIntrinsicBounds(null, null, null, null)
                } else {
                    mClearButtonImage = ResourcesCompat.getDrawable(resources, R.drawable.ic_cancel_black_14dp, null)!!
                    setCompoundDrawablesRelativeWithIntrinsicBounds(null, null, mClearButtonImage, null)
                }
            }

            override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {

            }

            override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {

            }
        })

        setOnTouchListener(this)
    }

    override fun onTouch(view: View?, motionEvent: MotionEvent?): Boolean {
        when (view) {
            this -> {
                Log.d("clear", "yay")
                when (motionEvent?.action!!) {
                    MotionEvent.ACTION_DOWN -> {
                        if(motionEvent?.rawX!! >= (this.right - this.compoundDrawables[2].bounds.width()!!))
                        setText("")
                    }
                    MotionEvent.ACTION_UP -> {
                        view.performClick()

                    }
                }
            }

        }
        return true
    }
}

【问题讨论】：

this.compoundDrawables[2] 将在没有可绘制对象时为空。

标签： android android-edittext kotlin

【解决方案1】：

您的onTouch 是错误的，因为它假定this.compoundDrawables[2] 不为空，但afterTextChanged 在某些情况下实际上使其为空。

请注意，view 和 motionEvent 不需要可以为空，因此您的代码可以简化为：

override fun onTouch(view: View, motionEvent: MotionEvent): Boolean {
    Log.d("clear", "yay")
    when (motionEvent.action) {
        MotionEvent.ACTION_DOWN -> {
            this.compoundDrawables[2]?.bounds?.width()?.run {
                // now, `this` refers to the non-null width
                if (motionEvent.rawX >= (this.right - this)) {
                    setText("")
                }
            }
        MotionEvent.ACTION_UP -> {
            view.performClick()
        }
    }
    return true
}

【讨论】：

【解决方案2】：

试试 TextInputLayout 的 endIconDrawable

<com.google.android.material.textfield.TextInputLayout
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_margin="8dp"
    app:hintEnabled="false"
    app:endIconMode="clear_text"
    app:endIconDrawable="@drawable/ic_close"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@+id/nav_up"
    app:layout_constraintTop_toTopOf="parent">

    <androidx.appcompat.widget.AppCompatEditText
    … />
</com.google.android.material.textfield.TextInputLayout>

【讨论】：