前言

在平时的开发中，我们经常会用到一个控件，那就是EditText。为了方便用户输入，同时也提高用户体验。今天就介绍一款自定义输入框—— ClearEditText

此输入框自带删除按钮。还可在左侧添加图标。那么，下面就来具体学习吧。

今天涉及的内容：

ClearEditText 功能简介

ClearEditText在MainActivity中的使用

效果图和项目结构图

ClearEditText源码及使用的相关配置

先来波效果图

2.gif

一.ClearEditText 功能简介

ClearEditText是一款含删除按钮的输入框控件，用户使用时，能很方便的删除输入框中的内容。ClearEditText还能实现左侧含图标的展示效果。

下面来讲讲ClearEditText在MainActivity中的使用

二.ClearEditText在MainActivity中的使用

2.1 ClearEditText在布局中的引入

在 activity_main.xml 布局中引入ClearEditText，你可以像下面这样：

在布局开头声明自定义属性引用:

xmlns:clearEditText="http://schemas.android.com/apk/res-auto"

类似下面这样：

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

xmlns:clearEditText="http://schemas.android.com/apk/res-auto"

android:id="@+id/container_layout"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity">

//其他代码省略

//......

在布局中引入控件，类似下面这样(注：ClearEditText路径以你实际项目路径为主)：

android:id="@+id/edt_name"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_marginStart="30dp"

android:layout_marginTop="24dp"

android:layout_marginEnd="30dp"

android:background="#00000000"

android:drawablePadding="10dp"

android:hint="请输入联系人名称"

android:paddingTop="15dp"

android:paddingBottom="15dp"

android:singleLine="true"

android:textColor="#000000"

android:textColorHint="#aaaaaa"

android:textSize="14sp"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toBottomOf="@+id/tv"/>

2.2 ClearEditText几个重要属性的讲解

ClearEditText除了以上的一些基本设置外，还有几个重要属性的设置：

设置右侧删除按钮

//设置右侧删除按钮的图标

android:drawableRight="@drawable/ic_clear_edit_delete"

//设置右侧删除按钮的宽度

clearEditText:rightDrawable_width="15dp"

//设置右侧删除按钮的高度

clearEditText:rightDrawable_height="15dp"

以上属性可以不设置，默认图标是一个带"X"的圆形图标，宽高默认15dp

设置左侧图标

//设置输入框左侧图标，默认为null，即不设置

android:drawableLeft="@drawable/ic_clear_edit_delete"

//设置输入框左侧图标宽度，默认20dp，当有左侧图标时才设置

clearEditText:leftDrawable_width="20dp"

//设置输入框左侧图标高度，默认20dp，当有左侧图标时才设置

clearEditText:leftDrawable_height="20dp"

设置图标和文字间距

android:drawablePadding="10dp"

设置输入框光标颜色宽度

android:textCursorDrawable="@drawable/clear_edit_cursor"

clear_edit_cursor.xml代码如下：

不设置此属性的时候，输入框光标显示系统默认

2.3 在MainActivity中初始化及监听

初始化：

//声明控件

private ClearEditText mClearEditText;

//控件初始化

mClearEditText = findViewById(R.id.edt_name);

若要监听ClearEditText输入动作，你可以这样设置监听：

//监听输入的动作

mClearEditText.setOnEditerListener(new ClearEditText.OnEditerListener() {

@Override

public void afterTextChanged(View view, Editable s) {

//处理你的逻辑

//......

}

});

三.效果图和项目结构图

效果图

2.gif

项目结构图

image.png

四.ClearEditText源码及使用的相关配置

ClearEditText源码如下：