安卓自定义带删除图标的输入框EditView

在安卓中我们使用默认的Editview是只能输入文字的,但是想要删除,我们得利用输入法的删除按钮来一个个删除,现在在好多应用当中,会在输入框的最后出现一个删除图片,点击就清空了所有的数据,这个很方便。下面我们来实现一下。

先看下效果图:

我们这里实现的是,当输入框有文本是,才会出现这个删除图标。当输入为空是,就会消失,其实就是自定义一个Ediiview:


/**
 * 输入文本框 右边有自带的删除按钮 当有输入时,显示删除按钮,当无输入时,不显示删除按钮。
 *
 *
 */
public class ClearEditText extends EditText implements OnFocusChangeListener, TextWatcher {
	/**
	 * 删除按钮的引用
	 */
	private Drawable mClearDrawable;
	/**
	 * 控件是否有焦点
	 */
	private boolean hasFoucs;

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

	public ClearEditText(Context context, AttributeSet attrs) {
		// 这里构造方法也很重要,不加这个很多属性不能再XML里面定义
		this(context, attrs, android.R.attr.editTextStyle);
	}

	public ClearEditText(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		init();
	}

	private void init() {
		// 获取EditText的DrawableRight,假如没有设置我们就使用默认的图片
		mClearDrawable = getCompoundDrawables()[2];
		if (mClearDrawable == null) {
			// throw new
			// NullPointerException("You can add drawableRight attribute in XML");
			mClearDrawable = getResources().getDrawable(R.drawable.button_login_delete);
		}

		mClearDrawable.setBounds(0, 0, mClearDrawable.getIntrinsicWidth(), mClearDrawable.getIntrinsicHeight());
		// 默认设置隐藏图标
		setClearIconVisible(false);
		// 设置焦点改变的监听
		setOnFocusChangeListener(this);
		// 设置输入框里面内容发生改变的监听
		addTextChangedListener(this);
	}

	/**
	 * 因为我们不能直接给EditText设置点击事件,所以我们用记住我们按下的位置来模拟点击事件 当我们按下的位置 在 EditText的宽度 -
	 * 图标到控件右边的间距 - 图标的宽度 和 EditText的宽度 - 图标到控件右边的间距之间我们就算点击了图标,竖直方向就没有考虑
	 */
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		if (event.getAction() == MotionEvent.ACTION_UP) {
			if (getCompoundDrawables()[2] != null) {

				boolean touchable = event.getX() > (getWidth() - getTotalPaddingRight()) && (event.getX() < ((getWidth() - getPaddingRight())));

				if (touchable) {
					this.setText("");
				}
			}
		}

		return super.onTouchEvent(event);
	}

	/**
	 * 当ClearEditText焦点发生变化的时候,判断里面字符串长度设置清除图标的显示与隐藏
	 */
	@Override
	public void onFocusChange(View v, boolean hasFocus) {
		this.hasFoucs = hasFocus;
		if (hasFocus) {
			setClearIconVisible(getText().length() > 0);
		} else {
			setClearIconVisible(false);
		}
	}

	/**
	 * 设置清除图标的显示与隐藏,调用setCompoundDrawables为EditText绘制上去
	 *
	 * @param visible
	 */
	protected void setClearIconVisible(boolean visible) {
		Drawable right = visible ? mClearDrawable : null;
		setCompoundDrawables(getCompoundDrawables()[0], getCompoundDrawables()[1], right, getCompoundDrawables()[3]);
	}

	/**
	 * 当输入框里面内容发生变化的时候回调的方法
	 */
	@Override
	public void onTextChanged(CharSequence s, int start, int count, int after) {
		if (hasFoucs) {
			setClearIconVisible(s.length() > 0);
		}
	}

	@Override
	public void beforeTextChanged(CharSequence s, int start, int count, int after) {

	}

	@Override
	public void afterTextChanged(Editable s) {

	}

}

我们在使用的时候,只要替换Editview,换成我们自定义的就行了:

<com.test.view.ClearEditText
                    android:id="@+id/edit_user"
                    android:layout_width="1px"
                    android:layout_height="fill_parent"
                    android:layout_marginLeft="10.0dip"
                    android:layout_marginRight="15.0dip"
                    android:layout_weight="3"
                    android:background="@android:color/white"
                    android:hint="账号/邮箱/手机号码"
                    android:inputType="textPersonName"
                    android:maxLength="30"
                    android:paddingLeft="10.0dip"
                    android:singleLine="true"
                    android:textSize="16.0sp" />

这样就会有我们想要的效果了。完整demo我就不提供了。

时间: 2024-11-08 01:39:55

安卓自定义带删除图标的输入框EditView的相关文章

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

我们经常在一些应用中见到输入框带有删除功能,今天我们就来实现这个功能(文字组织能力不强,大家随便看看).主要是记录一下自己的学习经历,如果对大家有帮助,我会更开心的. 先上图: 实现要点: 1.当输入框为空时,删除按钮隐藏: 2.当输入框不为空时,显示删除按钮. 核心代码: package com.example.view; import com.example.ui.R; import android.content.Context; import android.graphics.Rect;

Android--&gt;轻松打造带删除按钮的输入框(EditText),附Emoji表情过滤

输入框带删除按钮, 此乃标配, 实现起来方法也很多, 网上开源也很多. 但是, 没事就喜欢瞎折腾. 上图说话. 只是在原生的基础上加了扩展. 相对来说入侵非常少, 使用方法和原生的一模一样.无任何阉割. 完整代码: public class ExEditText extends AppCompatEditText { Rect clearRect = new Rect(); public ExEditText(Context context) { super(context); } public

35.Android之带删除按钮EditText学习

今天实现Android里自定义带删除功能的EditText,效果如下: 当输入内容时,EditText变为带有一个删除功能按钮的编辑框,如图: 实现代码很简单,直接上代码, 布局文件xml: 1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 an

自定义EditText,带删除按键

带清空按键,还可左右加图片,默认的是加了清空图片. 清空内容是判断的手势点击EditText的范围. 自定义EditText代码如下: import android.content.Context; import android.graphics.drawable.Drawable; import android.text.Editable; import android.text.TextUtils; import android.text.TextWatcher; import androi

自定义EditText 实现带清空按钮的输入框

注:本文转载自csdn,其中实现清除功能所采用的方案比较可取. 原文如下: 项目要求:做出包含根据情况可变色的下划线,左侧有可变图标,右侧有可变删除标志的edittext,如图 记录制作过程: 第一版本: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52

[Android]自己定义带删除输入框

在项目开发中,带删除button输入框也是人们经常常使用到的,该文章便介绍一下怎样创建一个带删除输入框.当中,须要解决的问题例如以下: a)创建自己定义editText类 b)在自己定义editText中显示删除图片 c)依据输入框的输入情况显示或隐藏图片 d)点击删除图片文字消失,图片隐藏 e)依据输入框焦点失去和获得状态显示或隐藏图片 好了.问题明白了.開始实现功能: a)创建一个名为MyClearEditText的class文件,并集成EditText,实现其构造方法: public My

自定义组件------带删除功能的EditText

以前在为EditText添加左侧图标,以及右侧一个删除按钮时,经常是使用FrameLayout,当这样代码复用差,维护也麻烦.最好的方法是重写EditText实现该功能.现在看看效果图,后面再讲解实现方式. 重写之后的组件有如下功能,只有当EditText内容不为空,而且获得焦点,才会出现删除按钮,点击删除按钮则清空内容.代码如下: public class CleanableEditText extends EditText { //回调函数 private TextWatcherCallBa

Android 带清除功能的输入框控件ClearEditText,仿IOS的输入框

转载请注明出处http://blog.csdn.net/xiaanming/article/details/11066685 今天给大家带来一个很实用的小控件ClearEditText,就是在Android系统的输入框右边加入一个小图标,点击小图标可以清除输入框里面的内容,IOS上面直接设置某个属性就可以实现这一功能,但是Android原生EditText不具备此功能,所以要想实现这一功能我们需要重写EditText,接下来就带大家来实现这一小小的功能 我们知道,我们可以为我们的输入框在上下左右

(转载) Android 带清除功能的输入框控件ClearEditText,仿IOS的输入框

Android 带清除功能的输入框控件ClearEditText,仿IOS的输入框 标签: Android清除功能EditText仿IOS的输入框 2013-09-04 17:33 70865人阅读 评论(57) 收藏 举报  分类: Android UI设计(7)  版权声明:本文为博主原创文章,未经博主允许不得转载. 转载请注明出处http://blog.csdn.net/xiaanming/article/details/11066685 今天给大家带来一个很实用的小控件ClearEdit