自定义输入框(带clear所有内容功能)

最新推荐文章于 2023-09-28 21:40:40 发布
最新推荐文章于 2023-09-28 21:40:40 发布
阅读量251 收藏
点赞数
分类专栏： android 文章标签： 移动开发 java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/iteye_11914/article/details/82581677
版权

效果图:

 

 

 

1 自定义控件CommonEditText.java代码:

package com.yiduoyun.cloudschool.view;

import android.content.Context;
import android.content.res.ColorStateList;
import android.content.res.TypedArray;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.text.Editable;
import android.text.InputFilter;
import android.text.InputType;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.inputmethod.EditorInfo;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView.OnEditorActionListener;

import com.yiduoyun.cloudschool.R;

/**
 * 
 * @ClassName: CommonEditText
 * @Description: 自定义的EditText，自带清空按钮（关于密码模式，需要设置password属性为TRUE，单纯设置inputType为textPassword不起作用）
 * @author gaoshunsheng 794419070@qq.com
 * @date 2014-3-6 下午1:44:30
 * 
 */
public class CommonEditText extends LinearLayout {

	private EditText editText;
	private ImageView imgClear;

	private TextWatcher textWatcher;

	private boolean isClearFunctionWork = true; 
	
	public CommonEditText(Context context, AttributeSet attrs) {
		super(context, attrs);
		LayoutInflater.from(getContext()).inflate(
				R.layout.layout_common_edit_text, this);
		editText = (EditText) findViewById(R.id.editText);
		
		imgClear = (ImageView) findViewById(R.id.imageView);
		imgClear.setVisibility(View.GONE);
		imgClear.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				editText.setText("");
				imgClear.setVisibility(View.GONE);
			}
		});

		// 这里处理自定义的属性
		TypedArray a = context.obtainStyledAttributes(attrs,
				R.styleable.CommonEditText);
		// 设置默认文本
		CharSequence hint = a.getText(R.styleable.CommonEditText_hint);
		editText.setHint(hint);
		// 设置文字大小
		float textsize = a.getDimensionPixelSize(R.styleable.CommonEditText_textSize, -1);
		if(-1 != textsize)
		{
			editText.setTextSize(textsize);
			//这个很重要，根据TextView的setRawTextSize方法源代码获得
			editText.getPaint().setTextSize(textsize);
			editText.invalidate();
		}
		
		// 设置EditText文字颜色
		ColorStateList textColor = a
				.getColorStateList(R.styleable.CommonEditText_textColor);
		if (null != textColor) {
			editText.setTextColor(textColor);
		}
		//设置EditText的Hint的文字颜色
		ColorStateList textColorHint = a
				.getColorStateList(R.styleable.CommonEditText_textColorHint);
		if (null != textColorHint) {
			editText.setHintTextColor(textColorHint);
		}
		// 设置EditText是否单行显示
		boolean singleLine = a.getBoolean(
				R.styleable.CommonEditText_singleLine, true);
		editText.setSingleLine(singleLine);
		// 设置InputType
		int inputType = a.getInt(R.styleable.CommonEditText_inputType,
				EditorInfo.TYPE_NULL);
		Log.i("InputType", inputType + "");
		if(EditorInfo.TYPE_NULL != inputType)
		{
			editText.setInputType(inputType);
		}
		else
		{
			editText.setInputType(EditorInfo.TYPE_CLASS_TEXT);
		}

		//设置MaxLength属性
		Integer maxLength = a.getInteger(R.styleable.CommonEditText_maxLength, 0);
		if(0 != maxLength)
		{
			InputFilter[] filters = {new InputFilter.LengthFilter(maxLength.intValue())};
			editText.setFilters(filters);
		}
		
		// 设置清空按钮的宽高
		int clearH = a.getDimensionPixelSize(
				R.styleable.CommonEditText_clearButtonHeight, -1);
		int clearW = a.getDimensionPixelSize(
				R.styleable.CommonEditText_clearButtonWidth, -1);
		if (-1 != clearH && -1 != clearW) {
			imgClear.setLayoutParams(new LayoutParams(clearH, clearW));
		}

		// 设置按钮的Padding
		int padding = a.getDimensionPixelSize(
				R.styleable.CommonEditText_clearButtonPadding, -1);
		if (-1 != padding) {
			imgClear.setPadding(padding, padding, padding, padding);
		}
		
		//设置密码模式
		boolean password = a.getBoolean(R.styleable.CommonEditText_password, false);
		if(password)
		{
			editText.setInputType(InputType.TYPE_CLASS_TEXT|InputType.TYPE_TEXT_VARIATION_PASSWORD);
		}
		//设置清空按钮图标
		Drawable drawableClear = a.getDrawable(R.styleable.CommonEditText_drawableClearButton);
		if(null != drawableClear)
		{
			imgClear.setImageDrawable(drawableClear);
		}
		//设置清空按钮显示状态
		boolean enableClearFunction = a.getBoolean(R.styleable.CommonEditText_enableClearFunction, true);
		isClearFunctionWork = enableClearFunction;
		//设置EditText监听
		editText.addTextChangedListener(new TextWatcher() {

			@Override
			public void afterTextChanged(Editable s) {

			}

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

			}

			@Override
			public void onTextChanged(CharSequence s, int start, int before,
					int count) {
				if(isClearFunctionWork)
				{
					toggleClearButton(s);
				}

			}

		});
		editText.setOnFocusChangeListener(new OnFocusChangeListener() {

			@Override
			public void onFocusChange(View v, boolean hasFocus) {
				if(isClearFunctionWork)
				{
					toggleClearButtonOnFocus(hasFocus);
				}
			}

		});
		a.recycle();
	}

	/**
	 * 切换清空按钮
	 * 
	 * @param s
	 */
	private void toggleClearButton(CharSequence s) {
		if (s.length() > 0) {
			imgClear.setVisibility(View.VISIBLE);
		} else {
			imgClear.setVisibility(View.GONE);
		}
	}

	/**
	 * 聚焦处理事件
	 * 
	 * @param onFocusChangeListener
	 */
	public void setOnFocusChangeListener(
			final OnFocusChangeListener onFocusChangeListener) {
		editText.setOnFocusChangeListener(new OnFocusChangeListener() {

			@Override
			public void onFocusChange(View v, boolean hasFocus) {
				if(isClearFunctionWork)
				{
					toggleClearButtonOnFocus(hasFocus);
				}
				onFocusChangeListener.onFocusChange(v, hasFocus);
			}

		});
	}

	private void toggleClearButtonOnFocus(boolean hasFocus) {
		if (!hasFocus) {
			imgClear.setVisibility(View.GONE);
		} 
		else if(hasFocus && editText.getText().length() > 0)
		{
			imgClear.setVisibility(View.VISIBLE);
		}
	}

	@Override
	protected void onFocusChanged(boolean gainFocus, int direction,
			Rect previouslyFocusedRect) {
		if(gainFocus)
		{
			editText.requestFocus();
		}
		super.onFocusChanged(gainFocus, direction, previouslyFocusedRect);
	}
	
	/**
	 * 设置密码模式
	 */
	public void setPasswordMode()
	{
		editText.setInputType(InputType.TYPE_CLASS_TEXT|InputType.TYPE_TEXT_VARIATION_PASSWORD);
	}
	
	/**
	 * 编辑动作监听器，对键盘上的操作作监听
	 * 
	 * @param onEditorActionListener
	 */
	public void setOnEditorActionListener(
			OnEditorActionListener onEditorActionListener) {
		editText.setOnEditorActionListener(onEditorActionListener);
	}

	/**
	 * 文本输入框内容改变事件
	 * 
	 * @param textWatcherImpl
	 */
	public void addTextChangedListener(TextWatcher textWatcherImpl) {
		this.textWatcher = textWatcherImpl;
		editText.addTextChangedListener(new TextWatcher() {

			@Override
			public void onTextChanged(CharSequence s, int start, int before,
					int count) {
				textWatcher.onTextChanged(s, start, before, count);
			}

			@Override
			public void beforeTextChanged(CharSequence s, int start, int count,
					int after) {
				textWatcher.beforeTextChanged(s, start, count, after);
			}

			@Override
			public void afterTextChanged(Editable s) {
				if(isClearFunctionWork)
				{
					toggleClearButton(s);
				}
				textWatcher.afterTextChanged(s);
			}
		});
	}

	public CommonEditText(Context context) {
		super(context);
	}

	/**
	 * //设置清空按钮显示状态
	 * @param showClearButton
	 */
	public void showClearButton(boolean showClearButton)
	{
		imgClear.setVisibility(showClearButton ? View.VISIBLE : View.GONE);
	}
	
	/*
	 * 返回EditText对象
	 */
	public EditText getEditText()
	{
		return editText;
	}
	
	public int getSelectionStart()
	{
		return editText.getSelectionStart();
	}
	
	public int getSelectionEnd()
	{
		return editText.getSelectionEnd();
	}
	
	public void setSelection(int selection)
	{
		editText.setSelection(selection);
	}
	
	public void setText(CharSequence charSequence)
	{
		editText.setText(charSequence);
	}
	
	public CharSequence getText()
	{
		return editText.getText();
	}
	
	public void setInputType(int inputType){
		editText.setInputType(inputType);
	}

	/**
	 * 设置文本输入框提示文本
	 * 
	 * @param hint
	 */
	public void setHint(String hint) {
		editText.setHint(hint);
	}

	/**
	 * 设置清空按钮Drawable对象
	 * @param drawable
	 */
	public void setClearButtonDrawable(Drawable drawable) {
		imgClear.setImageDrawable(drawable);
	}
}

 

 

2 布局代码layout_common_edit_text.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
	android:paddingLeft="10dp"
	android:paddingRight="10dp"    
    android:layout_gravity="center_vertical"
    android:gravity="center_vertical"
    android:orientation="horizontal" >

    <EditText 
        android:id="@+id/editText"
        android:layout_weight="1"
        android:cursorVisible="true"
        android:focusable="true"
        android:focusableInTouchMode="true"
        android:textCursorDrawable="@null"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@null"
        />
    
    <ImageView
        android:id="@+id/imageView"
        android:layout_weight="0"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/delete" />
   
</LinearLayout>

 

 

3 在values文件夹下加入样式文件editText_attrs.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="CommonEditText">
    <!-- set editText hint -->
	<attr name="hint" format="string" />
	<!-- set editText textSize -->
	<attr name="textSize" format="dimension" />
	<!-- set editText textColor -->
	<attr name="textColor" format="reference|color" />
	<!-- set editText textColorHint -->
	<attr name="textColorHint" format="reference|color" />
	<!-- set editText inpuType -->
	<attr name="inputType">
        <flag name="none" value="0x00000000" />
        <flag name="text" value="0x00000001" />
        <flag name="textCapCharacters" value="0x00001001" />
        <flag name="textCapWords" value="0x00002001" />
        <flag name="textCapSentences" value="0x00004001" />
        <flag name="textAutoCorrect" value="0x00008001" />
        <flag name="textAutoComplete" value="0x00010001" />
        <flag name="textMultiLine" value="0x00020001" />
        <flag name="textImeMultiLine" value="0x00040001" />
        <flag name="textNoSuggestions" value="0x00080001" />
        <flag name="textUri" value="0x00000011" />
        <flag name="textEmailAddress" value="0x00000021" />
        <flag name="textEmailSubject" value="0x00000031" />
        <flag name="textShortMessage" value="0x00000041" />
        <flag name="textLongMessage" value="0x00000051" />
        <flag name="textPersonName" value="0x00000061" />
        <flag name="textPostalAddress" value="0x00000071" />
        <flag name="textPassword" value="0x00000081" />
        <flag name="textVisiblePassword" value="0x00000091" />
        <flag name="textWebEditText" value="0x000000a1" />
        <flag name="textFilter" value="0x000000b1" />
        <flag name="textPhonetic" value="0x000000c1" />
        <flag name="textWebEmailAddress" value="0x000000d1" />
        <flag name="textWebPassword" value="0x000000e1" />
        <flag name="number" value="0x00000002" />
        <flag name="numberSigned" value="0x00001002" />
        <flag name="numberDecimal" value="0x00002002" />
        <flag name="numberPassword" value="0x00000012" />
        <flag name="phone" value="0x00000003" />
        <flag name="datetime" value="0x00000004" />
        <flag name="date" value="0x00000014" />
        <flag name="time" value="0x00000024" />
    </attr>
    <!-- set clear button padding -->
    <attr name="clearButtonPadding" format="dimension" />
    <!-- set clear button height -->
    <attr name="clearButtonHeight" format="dimension" />
    <!-- set clear button width -->
    <attr name="clearButtonWidth" format="dimension" />
    <!-- set editText height -->
    <attr name="editTextHeight" format="dimension" />
    <!-- set editText password -->
    <attr name="password" format="boolean" />
    <!-- set editText singleLine -->
    <attr name="singleLine" format="boolean" />
    <!-- set clearButton function works or not -->
    <attr name="enableClearFunction" format="boolean" />
    <!-- set editText maxLength -->
    <attr name="maxLength" format="integer" min="0" />
    <!-- set clearButton Drawable -->
    <attr name="drawableClearButton" format="reference" />
    </declare-styleable>

</resources>

 

 

如上图的布局为:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res/com.yiduoyun.cloudschool"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#f0f0f0"
    android:orientation="vertical"
    android:padding="15dp" >

    <com.yiduoyun.cloudschool.view.CommonEditText
        android:id="@+id/input_new_phonenumber"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:background="@drawable/setting_input_shape"
        android:maxLength="20"
        android:paddingLeft="15dp"
        android:paddingRight="15dp"
        app:clearButtonHeight="40dp"
        app:clearButtonPadding="10dp"
        app:clearButtonWidth="40dp"
        app:hint="@string/input_new_phone"
        app:inputType="phone"
        app:singleLine="true"
        app:textColor="#000000"
        app:textColorHint="#707070"
        app:textSize="14sp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/send_authcode"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#B9E5F0"
            android:gravity="center"
            android:text="@string/send_authcode"
            android:textColor="#01A9CD" />

        <com.yiduoyun.cloudschool.view.CommonEditText
            android:id="@+id/input_authcode"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_marginLeft="15dp"
            android:layout_weight="1"
            android:background="@drawable/setting_input_shape"
            android:paddingLeft="12dp"
            android:paddingRight="12dp"
            app:clearButtonHeight="40dp"
            app:clearButtonPadding="10dp"
            app:clearButtonWidth="40dp"
            app:hint="@string/input_authcode"
            app:inputType="number"
            app:singleLine="true"
            app:textColor="#000000"
            app:textColorHint="#707070"
            app:textSize="14sp" />
    </LinearLayout>

</LinearLayout>

 

 

 

5 附加一个输入框的shape文件setting_input_shape.xml:

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    
   <!-- 实心 -->
   <solid android:color="#ffffff"/>
   <!-- 描边 -->
   <stroke
       android:width="1dp"
       android:color="#E2E2E2" />
    
</shape>

 

控件就可以使用了.

iteye_11914
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Android自定义输入框提示功能
01-21
本文实例为大家分享了Android自定义输入框提示的具体代码，供大家参考，具体内容如下 这是系统提供的一个控件：AutoCompleteTextView <AutoCompleteTextView android:layout_marginLeft=20dp android:id=@+id/...
一个简单的自定义输入框
知足常乐
03-30 1277
今天还是一篇关于自定义View相关的，带来一个大众的，常见的一个输入框，很多的场合下都能遇到，比如验证码，密码框等等
公共UI说明文档
ta47040781的博客
07-01 915
uisdk的说明
Android EditText用法大全
chwnpp2的专栏
12-17 1188
EditText是Android的基本控件之一，使用频率非常之高。 常见使用问题有： 1.如何让EditText不可编辑？ 这常见于首页的搜索框。点击搜索框后才真正跳转到搜索页面，而此时的搜索框是不可输入的。 办法：在布局里将其focusAble设置为false。如： <EditText android:id="@+id/et_mo
【HTML】使用 div 自定义实现 input、textarea 输入框（适合定制化场景）
qq_45677671的博客
07-05 2865
使用 div 自定义实现 input、textarea 输入框（适合定制化场景）
自定义输入框
Wangyuan_wo的博客
04-28 675
背景 客户的要求总是奇奇怪怪的，这个需求，触摸屏设备点击文本框输入时不弹出软键盘，用外接的键盘输入，一般来说，设备都有设置可以不弹出软键盘的，可是这个设备他找不到这个设置，因此就需要，自己写一个输入框，哎，绝了。 话不多说，上代码： HTML <div class="customizeInput"></div> CSS .customizeInput{ width: 260px; height: 36px; border: 1px solid #ddd;
Android 自定义EditText输入框带清空按钮
01-04
Android 自定义EditText输入框带清空按钮 当用户输入字符后 EditText会自动在输入框的内部右侧出现删除按钮 重写EditText达到简化布局的效果 效果图: 继承EditText package com.example.myedittexttest; import ...
js自定义密码输入框弹窗
05-29
js自定义密码输入框弹窗的demo，因项目需要所以编写了这个小demo，如有需要同志们可以自行下载直接复制粘贴就行，然后浏览器打开测试。
Angular 输入框实现自定义验证功能
10-20
AngularJS 表单和控件可以验证输入的数据。本文给大家介绍Angular 输入框实现自定义验证功能，非常不错，具有参考借鉴价值，需要的朋友参考下
iOS 自定义密码输入框 支持自定义密码
10-17
一个完全可以自定义密码输入的iOS代码，可以定义输入的密码各种样式，非常的法方便和好用,可以直接用在项目中
clearmin, Bootstrap 3响应 dashboard/webapp/admin 模板.zip
10-10
clearmin, Bootstrap 3响应 dashboard/webapp/admin 模板 #Clearmin 网页模板 Bootstrap 3 dashboard/webapp/admin 模板检查演示：http://cm.paomedia.com/doc浏览器支持：IE9+，( 。Chrome，Firefox，O
自定义键盘输入框的实现
Nothing replaces hard work！
01-22 1912
现在在很多输入界面中，会在键盘上方弄一个view，比如左边是输入框，右边会有一个按钮叫发送之类的，并且初始的时候，键盘是不显示的，这个view在最下面，当点击输入框的时候，view会随着键盘上滑，最后会固定在键盘的上方，当键盘消失时，输入框又随着键盘跑到底部，效果图就是类似微信的输入框那样，如下图所示： 这种效果要怎么处理呢？请看下面 为了让工具条上下移动，我们就要求出键盘上下移动的高
【Vue】二次封装elementUI自定义样式的input搜索框
最新发布
Fortaro的博客
09-28 2462
二次封装elementUI，制作自定义样式的input搜索框
editText设置输入最大值（不是长度）
huangbryant的博客
08-04 6380
package com.myplas.q.common.view;import android.text.InputFilter; import android.text.Spanned;/** * 编写： 黄双 * 时间： 2017/6/121519. * 邮箱： [email protected] */public class InputFilterMinMax implements
如何实现input输入框自带清除按钮
热门推荐
qq_26780317的博客
01-08 4万+
最近，项目中需要，在输入框获取焦点是动态显示“×”图标。即在输入框中输入内容时，右边显示“×”按钮；输入框为空时，“×”按钮消失。难点在于获取焦点的同时，获取输入内容。注意：本例子的样式基于bootstrap.css和jquery，不再单独添加样式。1.html部分，将button和input框放入同一个div中，清除按钮可以使用图片或fonts图标，我使用的是bootstrap中button样式...
jQuery mini ui 的总结
ChangKA的博客
03-09 4804
jQuery mini  ui常用的控件1. datavisibleBoolean是否显示控件enabledBoolean是否禁用控件tooltipString提示信息addCls ( String ) 增加样式类。removeCls ( String )去除样式类2.messageBoxmini.confirm（message, title, callback） 选择提示框messageIdmi...
jQuery Datepicker 日期控件 用法
路漫漫 修远兮
10-16 1万+
因为是转载文章 在此标明出处，以前有文章是转的没标明的请谅解，因为有些已经无法找到出处，或者与其它原因。 如有冒犯请联系本人，或删除，或标明出处。 因为好的文章，以前只想收藏，但连接有时候会失效，所以现在碰到好的直接转到自己这里。 原文 出处http://wenku.baidu.com/view/db15e9010740be1e650e9a1d.html
实现输入框自带清除按钮
GAMELOFT9----纸上得来终觉浅，绝知此事要躬行
05-20 2371
输入框自带清除按钮是很常见的需求了，网上有很多方案，最基础的是原生实现input和清除按钮，然后绑定一大堆事件，此种方案非常原始，而且复用性极差。稍微好点的方案有基于bootstrap和jQuery的，将input和清除按钮集成起来，但样式依赖bootstrap，加重了文件引入数，而且很容易有jQuery版本不兼容的问题。这里提供一个插件，仅依赖jQuery，我们实现的功能有： 1、以一种很简单的...
怎么利用pyqt做一个自定义输入框
04-01
可以通过继承QLineEdit类来实现自定义输入框，具体步骤如下： 1. 导入PyQt模块，包括QWidget和QLineEdit类。 ``` from PyQt5.QtWidgets import QWidget, QLineEdit ``` 2. 创建一个新类，继承自QLineEdit。 ``` ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值