Android自定义带删除按钮的Edittext

Android自定义带删除按钮的Edittext

题记:在我们做需求的时候经常会遇到一个需求, 就是输入框右侧需要一个删除按钮,点击后删除已输入文本输入内容.
今天我就给大家介绍一个实现的方法,正所谓道路千万条,喜欢的最好!这个功能实现起来有很多很多种方法.我今天介绍的也只是一种我认为比较好的一种方法.切记,选择最适合你的项目的,才是最好的!!

我使用的是继承自EditText

package com.arbitratorapp.view.custom;

import android.content.Context;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.support.constraint.ConstraintLayout;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.EditText;
import com.arbitratorapp.R;

//自定义View继承系统EditText
public class YjEditText extends EditText {
    private static final int DRAWABLE_LEFT = 0;
    private static final int DRAWABLE_TOP = 1;
    private static final int DRAWABLE_RIGHT = 2;
    private static final int DRAWABLE_BOTTOM = 3;
    private Boolean clickable = true;
    private Drawable mClearDrawable;
    public YjEditText(Context context) {
        super(context);
        init();
    }

    public YjEditText(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public YjEditText(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();

    }

    private void init() {
    	//获取右侧删除按钮的图片
        mClearDrawable = getResources().getDrawable(R.mipmap.ic_edit_text_clear);
    }

    @Override //当文本发生变化时
    protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {
        super.onTextChanged(text, start, lengthBefore, lengthAfter);
        /**设置是否显示删除按钮.
        当此EditText的isEnabled()等于true(激活状态) 并且hasFocus()等于true(拥有焦点) 并且已输入内容text长度大于0
        设置显示删除按钮
        */
        setClearIconVisible(isEnabled() && hasFocus() && text.length() > 0);
    }

    @Override
    protected void onFocusChanged(boolean focused, int direction, Rect previouslyFocusedRect) {
        super.onFocusChanged(focused, direction, previouslyFocusedRect);
        //当焦点状态发生变化时设置是否显示删除按钮
        setClearIconVisible(isEnabled() && focused && length() > 0);
    }


    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
        	//当点击动作为MotionEvent.ACTION_UP时
            case MotionEvent.ACTION_UP:
            	/**
            	* 获取右侧图片
            	* getCompoundDrawables() :返回左，上，右和下边框的drawable
            	* 我们只有右侧的,也就是数组中的第三个
            	*/
                Drawable drawable = getCompoundDrawables()[DRAWABLE_RIGHT];
                /**
                * 如果drawable 不为空,代表右侧有图片,
                * 点击位置的X 坐标,位于drawable中,此处只计算了x坐标,如果你觉得不够精确,可以自行添加y轴坐标的计算
                * 设置text为 "",清空输入内容
                */
                if (drawable != null && event.getX() <= (getWidth() - getPaddingRight())
                        && event.getX() >= (getWidth() - getPaddingRight() - drawable.getBounds().width())) {
                    setText("");
                }
                break;
        }
        return isEnabled() && super.onTouchEvent(event);
    }

    /**
     * 设置是否可点击界面的子view
     */
    public void setClickableChild(Boolean clickable){
        this.clickable = clickable;
    }

    private void setClearIconVisible(boolean visible) {
    /** 
    * 设置此View的上下左右的Drawables
    * 如果visible等于true,则使用我们的mClearDrawable ;false时,置空
    */
        setCompoundDrawablesWithIntrinsicBounds(getCompoundDrawables()[DRAWABLE_LEFT], getCompoundDrawables()[DRAWABLE_TOP],
                visible ? mClearDrawable : null, getCompoundDrawables()[DRAWABLE_BOTTOM]);
    }
}

这是我用的删除图标,就是上文中的R.mipmap.ic_edit_text_clear
你可以用的我,也可以自己搞一个.

主要是通过setCompoundDrawablesWithIntrinsicBounds方法来设置EditText上下左右的Drawable
getCompoundDrawables()获取以设置的Drawable
好了,文章到此结束!