自定义带删除按钮的EditText搜索框

话不多说  自定义带删除按钮的EditText

用到的素材

 

画圆角EditText

edit_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
  <solid android:color="#199541" />
    <corners android:radius="15dp" />
      <padding 
          	android:left="5dp" 
          	android:top="5dp"
          	android:right="5dp" 
          	android:bottom="5dp" />
</shape>

可以自己定义个xml search_title.xml 来用   测试 :activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ll_search_content"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#43AE66"
    android:focusable="true"
    android:focusableInTouchMode="true"
    android:gravity="center_vertical"
    android:orientation="horizontal"
    android:padding="10dp" >

    <Button
        android:id="@+id/btn_mg"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_gravity="center_vertical"
        android:background="#00000000"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:text="管理"
        android:textColor="#ffffff" />

    <com.example.myedittext.ClearEditText
        android:singleLine="true"
        android:id="@+id/et_earch"
        android:layout_width="0dp"
        android:layout_height="50dp"
        android:layout_marginRight="10dp"
        android:layout_weight="10"
        android:background="@drawable/edit_bg"
        android:drawableLeft="@drawable/search_icon"
        android:drawableRight="@drawable/delete"
        android:hint="搜索资料"
        android:textColor="#ffffff"
        android:textColorHint="#ffffff" />

    <Button
        android:id="@+id/btn_cancel"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_gravity="center_vertical"
       android:layout_weight="2"
        android:background="#00000000"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:text="取消"
        android:textColor="#ffffff" />

</LinearLayout>

  贴代码  : ClearEditText.java

package com.example.myedittext;

import android.content.Context;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

import android.widget.EditText;

/**
 * @说明： 自定义带删除按钮的EditText
 * @author SongAnWei
 * 
 */
public class ClearEditText extends EditText implements TextWatcher {
	// EditText右侧的删除按钮
	private Drawable mClearDrawable;

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

	public ClearEditText(Context context, AttributeSet attrs) {
		this(context, attrs, android.R.attr.editTextStyle);
	}

	public ClearEditText(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		init();
	}

	private void init() {
		// 获取EditText的DrawableRight,假如没有设置我们就使用默认的图片,获取图片的顺序是左上右下（0,1,2,3,）
		mClearDrawable = getCompoundDrawables()[2];

		if (mClearDrawable == null) {
			// 如果没有图片 就自己弄一张
			mClearDrawable = getResources().getDrawable(R.drawable.delete);
		}

		mClearDrawable.setBounds(0, 0, mClearDrawable.getIntrinsicWidth(),
				mClearDrawable.getIntrinsicHeight());
		// 默认设置隐藏图标
		setClearIconVisible(false);
		// 获取焦点事件
		setOnFocusChangeListener(new OnFocusChangeListener() {

			@Override
			public void onFocusChange(View v, boolean hasFocus) {
				if (hasFocus) {
					// 是否显示图标
					setClearIconVisible(getText().length() > 0);
				} else {
					setClearIconVisible(false);
				}
			}
		});
		// 设置输入框里面内容发生改变的监听
		addTextChangedListener(this);
	}

	/*
	 * @说明：isInnerWidth, isInnerHeight为ture，触摸点在删除图标之内，则视为点击了删除图标 event.getX()
	 * 获取相对应自身左上角的X坐标 event.getY() 获取相对应自身左上角的Y坐标 getWidth() 获取控件的宽度 getHeight()
	 * 获取控件的高度 getTotalPaddingRight() 获取删除图标左边缘到控件右边缘的距离 getPaddingRight()
	 * 获取删除图标右边缘到控件右边缘的距离 isInnerWidth: getWidth() - getTotalPaddingRight()
	 * 计算删除图标左边缘到控件左边缘的距离 getWidth() - getPaddingRight() 计算删除图标右边缘到控件左边缘的距离
	 * isInnerHeight: distance 删除图标顶部边缘到控件顶部边缘的距离 distance + height
	 * 删除图标底部边缘到控件顶部边缘的距离
	 */
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		if (event.getAction() == MotionEvent.ACTION_UP) {

			if (getCompoundDrawables()[2] != null) {
				int x = (int) event.getX();
				int y = (int) event.getY();
				Rect rect = getCompoundDrawables()[2].getBounds();
				int height = rect.height();
				int distance = (getHeight() - height) / 2;
				boolean isInnerWidth = x > (getWidth() - getTotalPaddingRight() - 10)
						&& x < (getWidth() - getPaddingRight());
				boolean isInnerHeight = y > distance && y < (distance + height);
				if (isInnerWidth && isInnerHeight) {
					this.setText("");
				}
			}

		}

		return super.onTouchEvent(event);
	}

	/**
	 * 是否显示图标
	 * 
	 * @param visible
	 */
	protected void setClearIconVisible(boolean visible) {
		Drawable right = visible ? mClearDrawable : null;
		setCompoundDrawables(getCompoundDrawables()[0],
				getCompoundDrawables()[1], right, getCompoundDrawables()[3]);
	}

	@Override
	public void onTextChanged(CharSequence s, int start, int count, int after) {

	}

	@Override
	public void beforeTextChanged(CharSequence s, int start, int count,
			int after) {

	}

	//当字体改变时图标是否删除
	@Override
	public void afterTextChanged(Editable s) {

		setClearIconVisible(s.length() > 0);

	}

}

好了  经验有限 大神勿喷