Android自定义控件EditText使用详解
本文实例为大家分享了Android自定义控件EditText的具体代码，供大家参考，具体内容如下
自定义控件分三种：
1. 自绘控件
2. 组合控件
3. 继承控件
代码已上传到 github
以后的自定义控件就都放这个仓库
需求
这里由于项目的需要实现一个自定义EditText,主要实现的为两点，一个是工具图标toolIcon，例如点击清除EditText内容。一个为EditText左边的提示图标hintIcon, 例如输入账号密码时前面的图标。
为了让这个控件的拓展性更高，设置了两个点击事件接口。对于toolIcon来说，默认点击事件为清除EditText内容，如果需要更改，在代码中设设置相关的点击事件即可。
步骤
继承EditText
编写attrs.xml, 创建declare-styleable
编写MyEditText
布局中使用
实现
获取布局文件中设置的属性
这里返回的是一个TypedArray数组，获取之后就可以获得布局文件中设置的属性了
private void init(Context context, AttributeSet attrs) {
TypedArray typedArray = context.getTheme().obtainStyledAttributes(
attrs,
R.styleable.MyEditText,
0, 0);
hintIcon = typedArray.getDrawable(R.styleable.MyEditText_hintIcon);
toolIcon = typedArray.getDrawable(R.styleable.MyEditText_toolIcon);
fixed = typedArray.getBoolean(R.styleable.MyEditText_fixed, true);
if (toolIcon != null && fixed) {
setHeight(toolIcon.getIntrinsicHeight());
}
setCompoundDrawablesWithIntrinsicBounds(hintIcon, null, null, null);
setCompoundDrawablePadding(10);
typedArray.recycle();
onClickListenerWithEditTextToolIcon = new OnClickListenerWithEditTextToolIcon() {
@Override
public void onClick() {
setText("");
}
};
}
设置资源图片
EditText是继承自TextView，在TextView中存在两个方法
setCompoundDrawablesWithIntrinsicBounds(left, top, right, bottom) setCompoundDrawables(left, top, right, bottom)
是设置资源图片的位置，第一个方法和第二个方法的区别在于第一个方法中资源图片的大小是由系统来获取图片固有的大小，第二个方法则是需要自己通过LayoutParams设置大小。
设置点击事件
我们通过setCompoundDrawables()等方法设置的图片，而由于在父类中并没有提供相关的图片点击处理接口，因此可以重写onTouchEvent()来实现相关的点击事件，只需要根据我们手指落点或抬起点的位置就可以判断手指是否点击了相关图片。在这里，我选择了手指抬起时处理
/**
* Override the touchEvent to judge whether click toolIcon or hintIcon
*
* @param event motionEvent
* @return super
*/
@Override
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_UP) {
if (hintIcon != null) {
if (event.getX() < hintIcon.getIntrinsicWidth()
&& event.getX() > 0) {
if (getCompoundDrawables()[0] != null
&& onClickListenerWithEditTextHintIcon != null) {
onClickListenerWithEditTextHintIcon.onClick();
}
}
}
if (toolIcon != null) {
if (event.getX() > (getWidth()
- toolIcon.getIntrinsicWidth())
&& event.getX() < getWidth()) {
if (getCompoundDrawables()[2] != null ) {
onClickListenerWithEditTextToolIcon.onClick();
}
}
}
}
return super.onTouchEvent(event);
}
/**
* interface when click hintIcon
*/
public interface OnClickListenerWithEditTextHintIcon {
void onClick();
}
/**
* interface when click toolIcon
*/
public interface OnClickListenerWithEditTextToolIcon {
void onClick();
}
完整代码
package com.customwidget.lzqwidget.cuswidget;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.EditText;
import com.customwidget.lzqwidget.R;
/**
* Custom widget of EditText with two icon.
* Created by lizhongquan on 16-1-6.
*/
public class MyEditText extends EditText {
private Drawable hintIcon = null;
private Drawable toolIcon = null;
/**
* HintIcon clickListener
*/
private OnClickListenerWithEditTextHintIcon onClickListenerWithEditTextHintIcon = null;
/**
* Default clear the EditText
*/
private OnClickListenerWithEditTextToolIcon onClickListenerWithEditTextToolIcon = null;
/**
* Default fixed the Height
*/
private boolean fixed = true;
public MyEditText(Context context) {
super(context);
}
public MyEditText(Context context, AttributeSet attrs) {
super(context, attrs);
init(context, attrs);
}
public MyEditText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context, attrs);
}
private void init(Context context, AttributeSet attrs) {
TypedArray typedArray = context.getTheme().obtainStyledAttributes(
attrs,
R.styleable.MyEditText,
0, 0);
hintIcon = typedArray.getDrawable(R.styleable.MyEditText_hintIcon);
toolIcon = typedArray.getDrawable(R.styleable.MyEditText_toolIcon);
fixed = typedArray.getBoolean(R.styleable.MyEditText_fixed, true);
if (toolIcon != null && fixed) {
setHeight(toolIcon.getIntrinsicHeight());
}
setCompoundDrawablesWithIntrinsicBounds(hintIcon, null, null, null);
setCompoundDrawablePadding(10);
typedArray.recycle();
onClickListenerWithEditTextToolIcon = new OnClickListenerWithEditTextToolIcon() {
@Override
public void onClick() {
setText("");
}
};
}
/**
* Override the touchEvent to judge whether click toolIcon or hintIcon
*
* @param event motionEvent
* @return super
*/
@Override
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_UP) {
if (hintIcon != null) {
if (event.getX() < hintIcon.getIntrinsicWidth()
&& event.getX() > 0) {
if (getCompoundDrawables()[0] != null
&& onClickListenerWithEditTextHintIcon != null) {
onClickListenerWithEditTextHintIcon.onClick();
}
}
}
if (toolIcon != null) {
if (event.getX() > (getWidth()
- toolIcon.getIntrinsicWidth())
&& event.getX() < getWidth()) {
if (getCompoundDrawables()[2] != null ) {
onClickListenerWithEditTextToolIcon.onClick();
}
}
}
}
return super.onTouchEvent(event);
}
/**
* the clickListener of click hintIcon
*
* @param clickListenerOfHintIcon OnClickListenerWithEditTextHintIcon
*/
public void setOnClickListenerWithEditTextHintIcon(
OnClickListenerWithEditTextHintIcon clickListenerOfHintIcon) {
this.onClickListenerWithEditTextHintIcon = clickListenerOfHintIcon;
}
/**
* the clickListener of click toolIcon
*
* @param clickListenerOfToolIcon OnClickListenerWithEditTextToolIcon
*/
public void setOnClickListenerWithEditTextToolIcon(
OnClickListenerWithEditTextToolIcon clickListenerOfToolIcon) {
this.onClickListenerWithEditTextToolIcon = clickListenerOfToolIcon;
}
/**
* onTextChange
*
* @param text text
* @param start start
* @param lengthBefore lengthBefore
* @param lengthAfter lengthAfter
*/
@Override
protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {
super.onTextChanged(text, start, lengthBefore, lengthAfter);
if (text.length() > 0 && getCompoundDrawables()[2] == null && toolIcon != null) {
// hintIcon.setBounds(10, 0, 10, 0);
setCompoundDrawablesWithIntrinsicBounds(hintIcon, null, toolIcon, null);
}
if (text.length() == 0 && getCompoundDrawables()[2] != null && toolIcon != null) {
setCompoundDrawablesWithIntrinsicBounds(hintIcon, null, null, null);
}
}
/**
* interface when click hintIcon
*/
public interface OnClickListenerWithEditTextHintIcon {
void onClick();
}
/**
* interface when click toolIcon
*/
public interface OnClickListenerWithEditTextToolIcon {
void onClick();
}
}
attrs.xml:
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="MyEditText"> <attr name="hintIcon" format="integer" /> <attr name="toolIcon" format="integer" /> <attr name="fixed" format="boolean" /> </declare-styleable> </resources>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
您可能感兴趣的文章:
- Android自定义控件实现九宫格解锁功能
- Android自定义控件之日期选择控件使用详解
- Android编程实现自定义控件的方法示例
- 基于Android自定义控件实现雷达效果
- Android自定义控件实现下拉刷新效果
- Android自定义控件EditText实现清除和抖动功能
- Android自定义控件打造绚丽平行空间引导页
- Android自定义控件ViewFipper实现竖直跑马灯效果
- Android自定义控件ImageView实现点击之后出现阴影效果
- android自定义控件ImageView实现圆形图片
- 实例讲解Android自定义控件
相关推荐
-
Android自定义控件之日期选择控件使用详解
Android日期选择控件效果如下: 调用的代码: @OnClick(R.id.btn0) public void btn0() { final AlertDialog dialog = new AlertDialog.Builder(context).create(); dialog.show(); Window window = dialog.getWindow(); window.setContentView(R.layout.dialog_change_date); window.set
-
android自定义控件ImageView实现圆形图片
android开发中常常涉及到一种情况,就是将用户上传的图片以圆形样式显示,但是用户上传的图片可以有直角.圆角.正方形等多种不确定样式,这时就用到了自定义ImageView控件,在安卓客户端使接收到的图片全部以圆形样式显示 CircleImageView.java public class CircleImageView extends ImageView { private static final ScaleType SCALE_TYPE = ScaleType.CENTER_CROP; p
-
基于Android自定义控件实现雷达效果
如何制作出类似雷达扫描的效果,具体方法如下 一.效果图 二.实现思路 1.自定义控件RadarView用来画雷达的效果图,可以自定义属性包括 backgroundColor:背景颜色 circleNum:圆的数量 startColor:开始颜色 endColor:结束颜色 lineColor:线的颜色 2.通过Handler循环发送消息到MessageQueue中,将mRotate加3,使Matrix旋转mRotate,重绘雷达扫描的圆. 3.通过梯度渐变扫描渲染器SweepGradient,在
-
Android自定义控件ImageView实现点击之后出现阴影效果
今天美工 直接给我一张图片,要我实现图片点击之后有阴影效果,当时想到了ImageButton,随即自己写了个Demo,发现ImageButton继承ImageView 会有一个默认的背景样式,而且在布局中设计src(前景) 太丑,于是自己写了个自定义控件ImageView实现了点击之后,点击区域有一个灰色的阴影效果,如下: 添加监听回调等; 布局文件代码: <?xml version="1.0" encoding="utf-8"?> <Linear
-
Android自定义控件打造绚丽平行空间引导页
本文实例为大家分享了Android自定义控件打造平行空间引导页的具体代码,供大家参考,具体内容如下 先上图,动图太大传不上来,在项目中有动图 点击查看动图 首先解释下工程的主要部分. 首先谷歌的百分比布局做了部分修改,因为我设置的宽高都是相对于屏幕的宽度,而谷歌的百分比布局不能实现,只需要修改一部分代码就可以实现.下面贴出修改的部分代码 public static class PercentLayoutInfo { private enum BASEMODE { BASE_WIDTH, BASE
-
Android自定义控件实现九宫格解锁功能
最终Android九宫格解锁效果如下 1.进行定义实体point点 public class Point { private float x; private float y; //正常模式 public static final int NORMAL_MODE = 1; //按下模式 public static final int PRESSED_MODE = 2; //错误模式 public static final int ERROR_MODE = 3; private int state
-
Android自定义控件ViewFipper实现竖直跑马灯效果
一直想实现一个竖直跑马灯的效果,今天接触到了ViewFlipper这个控件, 是做安卓视图切换的, 对其用自定义控件进行包装;实现其点击回调和自定义视图等功能 不多说,直接上代码: 定义了一个自定义控件, 继承LinearLayout package com.example.viewfipperdemo; import android.content.Context; import android.util.AttributeSet; import android.view.LayoutIn
-
Android自定义控件实现下拉刷新效果
app开发中下拉刷新是最常接触到的一个功能,也有很多开源的框架,封装的非常棒.前段时间了解了一下ViewDragHelper,遂用它实现了下拉刷新的功能. 大概和我之前的ViewDragHelper之拖动加载(类似淘宝)这篇代码类似.只是做了相关改动.具体的可以看一下那篇博文了解一下用到的ViewDragHelper的一些知识点.该界面主要是一个LinearLayout,上面的下拉刷新是一个textview(用TV代替),当然这个可以定制,在此只是用一个textview代替,实现简单的功能,下面
-
实例讲解Android自定义控件
小编在此之前给大家介绍过关于Android自定义控件的用法等,需要的可以参考下: Android开发之自定义控件用法详解 详解Android自定义控件属性 可以看到QQ上的ToolBar其实就是一个自定义的view,可以看到不同的界面就是简单地修改了文字而已,在第二张与第三张尤其的明显,我们就仿QQ的这个Toolbar设置一个自定义控件 在开始之前,首先了解一下官方是如何实现一个控件的,比如说一个Linearlayout 它不是有layout_width和layout_height这两个属性吗?
-
Android编程实现自定义控件的方法示例
本文实例讲述了Android编程实现自定义控件的方法.分享给大家供大家参考,具体如下: 很多时候Android常用的控件不能满足我们的需求,那么我们就需要自定义一个控件了.今天做了一个自定义控件的实例,来分享下. 首先定义一个layout实现按钮内部布局: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.c
-
Android自定义控件EditText实现清除和抖动功能
本文实例为大家分享了Android EditText实现清除和抖动功能的具体代码,供大家参考,具体内容如下 源码如下: public class ClearEditText extends EditText implements View.OnFocusChangeListener,TextWatcher { / * 删除按钮的引用 */ private Drawable mClearDrawable; / * 控件是否有焦点 */ private boolean hasFoucs; publi