自定义View四

自定义带删除的编辑框EditTextWithDel

---

思路

• 准备好两张带不同颜色的删除图片

• 为EditText设置addTextChangedListener监听事件，在afterTextChanged里面设置对应的图片

  • 例如在构造方法里初始化 init();
    `

    private void init(){
    imgInalble = mContext.getResources().getDrawable(R.mipmap.delete_gray);
    imgAbel = mContext.getResources().getDrawable(R.mipmap.delete);
    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) {
           setDrawable();
    }
     });
        setDrawable();
    }
    

    `

• 接下来就是设置Drawable方法了，判断，如果输入框有内容，让图片显示，没有内容不现实或者显示一张颜色暗的图片
  `

   //设置删除图片
  private void setDrawable(){
  if(length() < 1){
      setCompoundDrawablesWithIntrinsicBounds(null,null,imgInalble,null);
  }else{
      setCompoundDrawablesWithIntrinsicBounds(null,null,imgAbel,null);
      }
  }
  

  `

• 最后就是实现点击图片(其实是点击矩形)清空编辑框内的文字了
  这里利用Rect来做，网上这种做法应该属于偷懒吧，不过简单.

  • 通过判断监听动作行为，如果是按下，则删除

    • 得到x,y坐标后再创建矩形rect.
    • 利用getGlobalVisibleRect(rect)方法获取在视图在屏幕坐标系的偏移量(即偏移量就是图片的宽);
    • 设置矩形的宽度(50)

    • 判断，如果按下的x,y坐标再矩形内，则文字清空
      `

      //处理删除事件
      @Override
      public boolean onTouchEvent(MotionEvent event) {
      if(imgAbel !=null && event.getAction()  == MotionEvent.ACTION_UP){
          int eventX = (int) event.getRawX();//整个屏幕
          int eventY = (int) event.getRawY();
          Log.i(TAG,"eventX= "+eventX +";     eventY= "+eventY);
          Rect rect = new Rect();
          getGlobalVisibleRect(rect);//方法的作用是获取视图在屏幕坐标系中的偏移量
          rect.left = rect.right - 50;
      if(rect.contains(eventX,eventY)){
          setText("");
          }
          }
      return super.onTouchEvent(event);
      }
      

      `