带删除Icon的EditText

带删除Icon的EditText

先上效果图：

这个控件是比较常用的。
使用了两种实现的方法，一种是继承EditText，另一种是由EditText和ImageView组成的组合控件实现。
第一种：

public class DeleteEditText extends EditText {

    private static final int EXTRA_AREA = 30;//额外点击范围
    //默认图标
    private int delIconId = R.mipmap.delete_icon;
    private Drawable delDrawalbe;
    private boolean isIconShow;


    public DeleteEditText(Context context) {
        this(context, null);
    }


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

    private void init(Context context) {
        delDrawalbe = ContextCompat.getDrawable(context, delIconId);
        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) {
                if (s.length() > 0) {
                    isIconShow = true;
                    setCompoundDrawablesWithIntrinsicBounds(null, null, delDrawalbe, null);
                } else {
                    isIconShow = false;
                    setCompoundDrawablesWithIntrinsicBounds(null, null, null, null);
                }
            }
        });
    }


    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (isIconShow) {
            Rect bounds = getCompoundDrawables()[2].getBounds();
            int x = (int) event.getX();
           int rectX = getWidth() - bounds.width() - EXTRA_AREA - getPaddingRight();
            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    if (x > rectX) {
                        clearText();
                         return true;
                    }
                    break;
            }

        }
        return super.onTouchEvent(event);
    }

    private void clearText() {
        setText("");
        isIconShow = false;
        //获取输入焦点
        setFocusable(true);
        setFocusableInTouchMode(true);
        requestFocus();
        findFocus();
    }

}

第二种：

public class DeleteView extends RelativeLayout {

    private ImageView ivDel;
    private EditText etText;

    public DeleteView(Context context) {
        this(context, null);
    }

    public DeleteView(Context context, AttributeSet attrs) {
        super(context, attrs);
        View.inflate(context, R.layout.view_delete, this);
        ivDel = (ImageView) findViewById(R.id.delete);
        etText = (EditText) findViewById(R.id.etText);
        //图标默认隐藏
        ivDel.setVisibility(GONE);
        etText.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) {
                if (s.length() > 0) {
                    ivDel.setVisibility(VISIBLE);
                } else {
                    ivDel.setVisibility(GONE);
                }
            }
        });

        ivDel.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                etText.setText("");
                //获取输入焦点
                etText.setFocusable(true);
                etText.setFocusableInTouchMode(true);
                etText.requestFocus();
                etText.findFocus();
            }
        });
    }


    public EditText getEditText() {
        return etText;
    }

    public ImageView getDelIv() {
        return ivDel;
    }

}

布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#b2b2b2"
    android:paddingLeft="20dp"
    android:paddingRight="20dp">

    <ImageView
        android:id="@+id/delete"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:src="@mipmap/delete_icon"/>


    <EditText
        android:id="@+id/etText"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerVertical="true"
        android:layout_toLeftOf="@id/delete"
        android:background="@null"/>


</RelativeLayout>

第一种跟第二种相比，感觉第一种会更加灵活，直接拷贝就能使用。

如果发现有不正确的地方或者需要改良改正的话，跪求指正。