自定义EditText清除功能实现

效果图:

GIF.gif

1. 编写xml布局 代码 如下:

<com.zjq.cleareditextview.ClearEditTextView
            android:id="@+id/et_username"
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:layout_marginTop="5dp"
            android:hint="QQ号/手机号/邮箱号"
            android:inputType="number"
            android:lines="1"
            android:maxLength="17"
            android:paddingLeft="13dp"
            android:textColorHint="#b9b7b7"
            android:textSize="16sp" />
注意这里的 com.zjq.clearedittextview.ClearEditTextView 要与你的 ClearEditTextView类包名相同

2.创建ClearEditTextView类并继承EditText

public class ClearEditTextView extends EditText implements View.OnFocusChangeListener,TextWatcher {

// 右边的删除按钮
private Drawable mClearDrawable;

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

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

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

private void init() {
    //获取右边删除按钮
    mClearDrawable = getResources().getDrawable(R.drawable.delete_selector);
    //设置删除按钮的边界
    mClearDrawable.setBounds(0, 0, mClearDrawable.getIntrinsicWidth(), mClearDrawable.getIntrinsicHeight());

    //设置默认隐藏删除按钮
    setClearIcon(false);

    //监听EditText焦点变化 ,根据text长度控制删除按钮的显示 .隐藏
    setOnFocusChangeListener(this);
    //监听文本内容变化
    addTextChangedListener(this);
}

/**
 * 控制EditText右边制删除按钮的显示、隐藏
 */
/**
 * 控制EditText右边制删除按钮的显示、隐藏
 */
private void setClearIcon(boolean isShow) {
    Drawable rightDrawable = isShow ? mClearDrawable : null;
    setCompoundDrawables(getCompoundDrawables()[0], getCompoundDrawables()[1],
            rightDrawable, getCompoundDrawables()[3]);
}  }
注意这里的R.drawable.delete_selector。

3.在miamap下面放入两张删除图片

一张是默认显示的图片

命名为:search_clear_normal.png

一张是按下删除按钮显示的图片

命名为:search_clear_pressed

4.在drawable文件下创建delete_selector.xml文件

<?xml version="1.0" encoding="utf-8"?>
< selector xmlns:android="http://schemas.android.com/apk/res/android">

<!--按下状态-->
<item android:state_pressed="true" android:drawable="@mipmap/search_clear_pressed" />

<!--默认显示-->
<item android:drawable="@mipmap/search_clear_normal" />

</selector>

设置引用mipmap下面的图片。
到此已经可以实现清除功能了!!
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,536评论 25 708
  • afinalAfinal是一个android的ioc,orm框架 https://github.com/yangf...
    passiontim阅读 15,569评论 2 45
  • ¥开启¥ 【iAPP实现进入界面执行逐一显】 〖2017-08-25 15:22:14〗 《//首先开一个线程,因...
    小菜c阅读 6,551评论 0 17
  • 我们先来看一个屌丝逆袭的美发故事 某某 亚洲短发小王子 也许有许多人不知道他 两年前他和绝大多数发型师一样,穷逼,...
    一号美发师阅读 3,296评论 8 21
  • 今年研一的学生 从小就被父母训练的很独立 可以自己单独完成的事情从来不寻求他人的帮助 这也就让我和父母之间没有太多...
    旧时光999阅读 161评论 0 1