ClearEditText 可以自己清楚的edittext

Android-EditText 自定义带删除功能的EditText


1.说明


自定义带删除功能的EditText有两种方法,第一种是用组合视图的方法,即在一个view视图里面左侧放置一个EditText,右侧放置一个ImageView,但是这样增加了视图的层次,而且对输入内容的长度要做一定的处理。

第二种是重新定义EditText组件,增加相应的事件处理,即可达到很好的效果,效果图如下:

ClearEditText 可以自己清楚的edittext_第1张图片

2.ClearEditText的JAVA类文件

[java]  view plain copy
  1. /** 
  2.  * @说明: 自定义带删除按钮的EditText 
  3.  * 
  4.  */  
  5. public class ClearEditText extends EditText implements OnFocusChangeListener,  
  6.         TextWatcher {  
  7.     //EditText右侧的删除按钮  
  8.     private Drawable mClearDrawable;  
  9.     private boolean hasFoucs;  
  10.   
  11.     public ClearEditText(Context context) {  
  12.         this(context, null);  
  13.     }  
  14.   
  15.     public ClearEditText(Context context, AttributeSet attrs) {  
  16.         this(context, attrs, android.R.attr.editTextStyle);  
  17.     }  
  18.   
  19.     public ClearEditText(Context context, AttributeSet attrs, int defStyle) {  
  20.         super(context, attrs, defStyle);  
  21.         init();  
  22.     }  
  23.   
  24.     private void init() {  
  25.         // 获取EditText的DrawableRight,假如没有设置我们就使用默认的图片,获取图片的顺序是左上右下(0,1,2,3,)  
  26.         mClearDrawable = getCompoundDrawables()[2];  
  27.         if (mClearDrawable == null) {  
  28.             mClearDrawable = getResources().getDrawable(  
  29.                     R.drawable.edit_delete);  
  30.         }  
  31.   
  32.         mClearDrawable.setBounds(00, mClearDrawable.getIntrinsicWidth(),  
  33.                 mClearDrawable.getIntrinsicHeight());  
  34.         // 默认设置隐藏图标  
  35.         setClearIconVisible(false);  
  36.         // 设置焦点改变的监听  
  37.         setOnFocusChangeListener(this);  
  38.         // 设置输入框里面内容发生改变的监听  
  39.         addTextChangedListener(this);  
  40.     }  
  41.           
  42.     /* @说明:isInnerWidth, isInnerHeight为ture,触摸点在删除图标之内,则视为点击了删除图标 
  43.      * event.getX() 获取相对应自身左上角的X坐标 
  44.      * event.getY() 获取相对应自身左上角的Y坐标 
  45.      * getWidth() 获取控件的宽度 
  46.      * getHeight() 获取控件的高度 
  47.      * getTotalPaddingRight() 获取删除图标左边缘到控件右边缘的距离 
  48.      * getPaddingRight() 获取删除图标右边缘到控件右边缘的距离 
  49.      * isInnerWidth: 
  50.      *  getWidth() - getTotalPaddingRight() 计算删除图标左边缘到控件左边缘的距离 
  51.      *  getWidth() - getPaddingRight() 计算删除图标右边缘到控件左边缘的距离 
  52.      * isInnerHeight: 
  53.      *  distance 删除图标顶部边缘到控件顶部边缘的距离 
  54.      *  distance + height 删除图标底部边缘到控件顶部边缘的距离 
  55.      */  
  56.     @Override  
  57.     public boolean onTouchEvent(MotionEvent event) {  
  58.         if (event.getAction() == MotionEvent.ACTION_UP) {  
  59.             if (getCompoundDrawables()[2] != null) {  
  60.                 int x = (int)event.getX();  
  61.                 int y = (int)event.getY();  
  62.                 Rect rect = getCompoundDrawables()[2].getBounds();  
  63.                 int height = rect.height();  
  64.                 int distance = (getHeight() - height)/2;  
  65.                 boolean isInnerWidth = x > (getWidth() - getTotalPaddingRight()) && x < (getWidth() - getPaddingRight());  
  66.                 boolean isInnerHeight = y > distance && y <(distance + height);  
  67.                 if (isInnerWidth && isInnerHeight) {  
  68.                     this.setText("");  
  69.                 }  
  70.             }  
  71.         }  
  72.         return super.onTouchEvent(event);  
  73.     }  
  74.   
  75.     /** 
  76.      * 当ClearEditText焦点发生变化的时候, 
  77.      * 输入长度为零,隐藏删除图标,否则,显示删除图标 
  78.      */  
  79.     @Override  
  80.     public void onFocusChange(View v, boolean hasFocus) {  
  81.         this.hasFoucs = hasFocus;  
  82.         if (hasFocus) {  
  83.             setClearIconVisible(getText().length() > 0);  
  84.         } else {  
  85.             setClearIconVisible(false);  
  86.         }  
  87.     }  
  88.   
  89.     protected void setClearIconVisible(boolean visible) {  
  90.         Drawable right = visible ? mClearDrawable : null;  
  91.         setCompoundDrawables(getCompoundDrawables()[0],  
  92.                 getCompoundDrawables()[1], right, getCompoundDrawables()[3]);  
  93.     }  
  94.   
  95.     @Override  
  96.     public void onTextChanged(CharSequence s, int start, int count, int after) {  
  97.         if (hasFoucs) {  
  98.             setClearIconVisible(s.length() > 0);  
  99.         }  
  100.     }  
  101.   
  102.     @Override  
  103.     public void beforeTextChanged(CharSequence s, int start, int count,  
  104.             int after) {  
  105.   
  106.     }  
  107.   
  108.     @Override  
  109.     public void afterTextChanged(Editable s) {  
  110.   
  111.     }  
  112.       
  113.   
  114. }  


3.引用ClearEditText的XML文件

[html]  view plain copy
  1. <com.once.android_ui.selfview.ClearEditText  
  2.         android:id="@+id/user_name"  
  3.         android:layout_width="match_parent"  
  4.         android:layout_height="wrap_content"  
  5.         android:drawableLeft="@drawable/user_name"  
  6.         android:drawablePadding="7dp"  
  7.         android:hint="@string/name_tip"  
  8.         android:singleLine="true"  
  9.         android:textSize="17sp" >  
  10.         <requestFocus />  
  11.     com.once.android_ui.selfview.ClearEditText>  

附件是图片资源文件。

你可能感兴趣的:(Android自定义组件)