实现带清除功能的文本输入框（EditText）

第一：首先扯点别的
光阴似箭，日月如梭啊，今天是腊月二十五了，明天就是立春了。今天是工作的最后一天，明天就要回家了。
第二 :进入正题吧，实现带清除功能的文本输入框，先看看效果吧。

接下来就是代码了

1. 首先自定义一个View. MyEditText 继承自EditText

import android.content.Context;
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.view.View.OnFocusChangeListener;
import android.widget.EditText;

public class MyEditText extends EditText implements OnFocusChangeListener, TextWatcher{

	private Drawable rightDrawable;
	
	public MyEditText(Context context) {
		super(context);
	}
	public MyEditText(Context context, AttributeSet attrs) {
		super(context, attrs);
		init();
	}
	 private void init() { 
	    	//获取EditText的DrawableRight,假如没有设置我们就使用默认的图片
		 rightDrawable = getCompoundDrawables()[2]; 
	        if (rightDrawable == null) { 
	        	rightDrawable = getResources().getDrawable(R.drawable.clear_input); 
	        } 
	        //Specify a bounding rectangle for the Drawable. This is where the drawable will draw when its draw() method is called. 
	        rightDrawable.setBounds(0, 0, rightDrawable.getIntrinsicWidth(), rightDrawable.getIntrinsicHeight()); 
	        //默认设置隐藏图标 
	        setClearIconVisible(false); 
	        //设置焦点改变的监听
	        setOnFocusChangeListener(this); 
	        //设置输入框里面内容发生改变的监听  
	        addTextChangedListener(this); 
	    } 
	 
	 /**
	     * 因为我们不能直接给EditText设置点击事件，所以我们用记住我们按下的位置来模拟点击事件
	     * 当我们按下的位置 在  EditText的宽度 - 图标到控件右边的间距 - 图标的宽度  和
	     * EditText的宽度 - 图标到控件右边的间距之间我们就算点击了图标，竖直方向没有考虑
	     */
	 @Override
	public boolean onTouchEvent(MotionEvent event) {
		 if (getCompoundDrawables()[2]!=null) {
			if (event.getAction()==MotionEvent.ACTION_UP) {
				boolean touchable = event.getX() > (getWidth() - getPaddingRight() - rightDrawable.getIntrinsicWidth()) && (event.getX() < ((getWidth() - getPaddingRight())));
            	//如果触摸的位置在图片的范围内，清空EditText
                if (touchable) { 
                    this.setText(""); 
                } 
			}
		}
		return super.onTouchEvent(event);
		
	}
	 /**
	  * 设置清除图标的显示与隐藏，调用setCompoundDrawables为EditText绘制上去
	  * @param b
	  */
	private void setClearIconVisible(boolean visible) {
		 Drawable right = visible ? rightDrawable : null; 
	        setCompoundDrawables(getCompoundDrawables()[0],getCompoundDrawables()[1], right, getCompoundDrawables()[3]); 
	    
	}
	@Override
	public void afterTextChanged(Editable arg0) {
		
	}
	@Override
	public void beforeTextChanged(CharSequence arg0, int arg1, int arg2,
			int arg3) {
		
	}
	/**
	 * 这个方法得注意,当输入框里面内容发生变化的时候回调的方法
	 */
	@Override
	public void onTextChanged(CharSequence text, int start,int lengthBefore, int lengthAfter) {
		setClearIconVisible(text.length() > 0); 
	}
	/**
	 * 焦点改变的回调
	 */
	@Override
	public void onFocusChange(View arg0, boolean hasFocus) {
		if (hasFocus) { 
            setClearIconVisible(getText().length() > 0); 
        } else { 
            setClearIconVisible(false); 
        } 
	}

}

该写的注释，代码里差不多都写了，仔细看看就行了。

2. MainActivity很简单，如下所示，没有什么可说的，代码如下：

import android.app.Activity;
import android.os.Bundle;
import android.view.Window;


public class MainActivity extends Activity {

	private MyEditText myEditText;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //去掉标题栏
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        myEditText=(MyEditText) findViewById(R.id.myText);
    }
}

3.MainActivity的xml文件，也是很简单。activity_main,如下所示：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
   >
   
 <com.example.myedittext.MyEditText
    android:id="@+id/myText"
    android:hint="搜索"
    android:layout_marginTop="30dp"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:drawableLeft="@drawable/search"
    android:drawableRight="@drawable/clear_input"
    android:background="@drawable/bg_myedittext"
    /> 
</LinearLayout>

此时请注意了：

1. android:background="@drawable/bg_myedittext",这一句。
   bg_myedittext.xml文件，在res目录下新建一个drawable文件夹，新建一个xml文件，Root Element选择shape,代码如下

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <!--矩形的填充色，白色-->
    <solid android:color="#fff"/>
    <!--矩形的四个角的弯度-->
    <corners android:radius="7dp"/>
    <!--矩形的边框的粗细和颜色-->
    <stroke android:width="1dp" android:color="#ff3344"/>

</shape>

然后就结束了吧。最后说一下，这个实现过程是参考的如下网址

1. Android 带清除功能的输入框控件ClearEditText,仿IOS的输入框

代码下载网址 ：http://download.csdn.net/detail/leilifengxingmw/9426255