【Android】EditText之DrawableLeft和D

作者：邹峰立，微博：zrunker，邮箱：zrunker@yahoo.com，微信公众号：书客创作，个人平台：www.ibooker.cc。

本文选自书客创作平台第35篇文章。阅读原文 。

书客创作

EditText有一些特殊的属性，而这些属性可能帮助完成一些想不到的功能，例如EditText的DrawableLeft和DrawableRight属性，这两个属性虽说是EditText中微不足道的属性，但是我们能够在很多APP应用当中看到它们所发挥的作用，特别是对于EditText的DrawableLeft和DrawableRight的点击事件，那么该如何实现它们点击事件监听呢？

应用场景

DrawableLeft和DrawableRight点击事件监听，是一个比较常见的功能，例如在加入购物车的时候，我们常常看到商品数量增加和减少功能的实现。

主要重难点

1、自定义EditText实现它的OnTouchEvent方法。
2、DrawableLeft和DrawableRight如何设置点击事件监听。怎么才算是Drawable被点击？如果有内边距的情况下又是怎么处理？

代码实现

1、自定义EditText

public class DrawableEditText extends android.support.v7.widget.AppCompatEditText {

    // 构造方法
    public DrawableEditText(Context context) {
        super(context);
    }

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

    public DrawableEditText(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    // 触摸事件
    // 判断DrawableLeft/DrawableRight是否被点击
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        // 触摸状态
        if (event.getAction() == MotionEvent.ACTION_UP) {
            // 监听DrawableLeft
            if (onDrawableLeftListener != null) {
                // 判断DrawableLeft是否被点击
                Drawable drawableLeft = getCompoundDrawables()[0];
                // 当按下的位置 < 在EditText的到左边间距+图标的宽度+Padding
                if (drawableLeft != null && event.getRawX() <= (getLeft() + getTotalPaddingLeft() + drawableLeft.getBounds().width())) {
                    // 执行DrawableLeft点击事件
                    onDrawableLeftListener.onDrawableLeftClick();
                }
            }

            // 监听DrawableRight
            if (onDrawableRightListener != null) {
                Drawable drawableRight = getCompoundDrawables()[2];
                // 当按下的位置 > 在EditText的到右边间距-图标的宽度-Padding
                if (drawableRight != null && event.getRawX() >= (getRight() - getTotalPaddingRight() - drawableRight.getBounds().width())) {
                    // 执行DrawableRight点击事件
                    onDrawableRightListener.onDrawableRightClick();
                }
            }
        }
        return super.onTouchEvent(event);
    }

    // 定义一个DrawableLeft点击事件接口
    public interface OnDrawableLeftListener {
        void onDrawableLeftClick();
    }

    private OnDrawableLeftListener onDrawableLeftListener;

    public void setOnDrawableLeftListener(OnDrawableLeftListener onDrawableLeftListener) {
        this.onDrawableLeftListener = onDrawableLeftListener;
    }

    // 定义一个DrawableRight点击事件接口
    public interface OnDrawableRightListener {
        void onDrawableRightClick();
    }

    private OnDrawableRightListener onDrawableRightListener;

    public void setOnDrawableRightListener(OnDrawableRightListener onDrawableRightListener) {
        this.onDrawableRightListener = onDrawableRightListener;
    }
}

2、在布局文件中引入自定义EditText

<cc.ibooker.ibooker.DrawableEditText
  android:id="@+id/ed_drawable"
  android:layout_width="match_parent"
  android:layout_height="50dp"
  android:drawableEnd="@mipmap/icon_add"
  android:drawableLeft="@mipmap/icon_reduce"
  android:drawablePadding="5dp"
  android:drawableRight="@mipmap/icon_add"
  android:drawableStart="@mipmap/icon_reduce"
  android:gravity="center"
  android:inputType="number"
  android:padding="10dp"
  android:text="1"/>

3、在Activity等组件中定义和使用DrawableLeft和DrawableRight点击事件

public class MainActivity extends AppCompatActivity {
  private DrawableEditText drawableEditText;
  private int count=0;//记录输入框内容
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    initView();
  }
  //初始化控件
  private void initView() {
    drawableEditText= (DrawableEditText) findViewById(R.id.ed_drawable);
    String str =drawableEditText.getText().toString().trim();
    if(!TextUtils.isEmpty(str))
      count= Integer.parseInt(str);
      drawableEditText.setOnDrawableLeftListener(new   DrawableEditText.OnDrawableLeftListener() {
      @Override
      public void onDrawableLeftClick() {
        //左侧Drawable点击监听
        if(count<=0)
          count=0;
        else
          count--;
        drawableEditText.setText(count+"");
      }
    });
    drawableEditText.setOnDrawableRightListener(new   DrawableEditText.OnDrawableRightListener() {
      @Override
      public void onDrawableRightClick() {
        //右侧Drawable点击监听
        count++;
        drawableEditText.setText(count+"");
      }
    });
  }
}

4、程序结构图和效果图

程序结构图 效果图

Github地址
阅读原文

---

微信公众号：书客创作