您的位置:首页 > 移动开发 > Android开发

19.Android 清除按钮EditText - AIEditText

2015-09-29 18:24 567 查看

19.Android 清除按钮EditText - AIEditText

Android 清除按钮EditText - AIEditText
实现思路

继承AppCompatEditText类

setCompoundDrawables设置图片

实现OnFocusChangeListener接口

实现ViewOnTouchListener接口

实现TextWatcher接口

AIEditText源码

AIEditText效果图

Github传送门

实现思路

1.继承AppCompatEditText类。

2.读取图片,每次都通过setCompoundDrawables将图片设置到EditText的右边。

3.实现OnFocusChangeListener接口,每次获得焦点的时候,进行一次文本的判断,如果有文本,显示图片;没有文本,隐藏图片。

4.实现View.OnTouchListener接口,每次onTouch的时候,判断是否点击到了图片,进行文本的清空。

5.实现TextWatcher接口,通过判断文本的长度,来决定图片是否显示。

继承AppCompatEditText类

public AIEditText(Context context) {
super(context);
this.init(context);
}

public AIEditText(Context context, AttributeSet attrs) {
super(context, attrs);
this.init(context);
}

public AIEditText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
this.init(context);
}


setCompoundDrawables设置图片

从TextView继承下来的方法setCompoundDrawables。

EditText也是TextView的子类,AppCompatEditText又是EditText的子类。

setCompoundDrawables(@Nullable Drawable left, @Nullable Drawable top,

@Nullable Drawable right, @Nullable Drawable bottom)


/**
* @param context
*/
private void init(Context context) {
Drawable drawable = ContextCompat.getDrawable(context, R.drawable.abc_ic_clear_mtrl_alpha);
Drawable wrappedDrawable = DrawableCompat.wrap(drawable);
DrawableCompat.setTint(wrappedDrawable, super.getCurrentHintTextColor());
this.mClearDrawable = wrappedDrawable;
this.mClearDrawable.setBounds(0, 0, this.mClearDrawable.getIntrinsicHeight(), this.mClearDrawable.getIntrinsicHeight());
this.setClearDrawableVisible(false);
super.setOnTouchListener(this);
super.setOnFocusChangeListener(this);
this.addTextChangedListener(this);
}

private void setClearDrawableVisible(boolean visible) {
this.mClearDrawable.setVisible(visible, false);
final Drawable[] compoundDrawables = this.getCompoundDrawables();
this.setCompoundDrawables(compoundDrawables[0], compoundDrawables[1], visible ? this.mClearDrawable : null, compoundDrawables[3]);
}


实现OnFocusChangeListener接口

每次获得焦点的时候,进行一次文本的判断,如果有文本,显示图片;没有文本,隐藏图片。

/**
* Called when the focus state of a view has changed.
*
* @param v        The view whose state has changed.
* @param hasFocus The new focus state of v.
*/
@Override
public void onFocusChange(View v, boolean hasFocus) {
if (hasFocus) {
this.setClearDrawableVisible(this.getText().length() > 0);
} else {
this.setClearDrawableVisible(false);
}
if (this.mOnFocusChangeListener != null)
this.mOnFocusChangeListener.onFocusChange(v, hasFocus);
}


实现View.OnTouchListener接口

每次onTouch的时候,判断是否点击到了图片,进行文本的清空。

/**
* @param v     The view the touch event has been dispatched to.
* @param event The MotionEvent object containing full information about
*              the event.
* @return True if the listener has consumed the event, false otherwise.
*/
@Override
public boolean onTouch(View v, MotionEvent event) {
final int x = (int) event.getX();
/**
* x > ableEditWidth (totalWidth - paddingRight - clearDrawableWidth )
* x > ableEditWidth == clearDrawable_X
* so , when clearDrawable is visible and onClick it.
*/
if (this.mClearDrawable.isVisible() && x > this.getWidth() - this.getPaddingRight() - this.mClearDrawable.getIntrinsicWidth()) {
if (event.getAction() == MotionEvent.ACTION_UP) {
this.setError(null);
this.setText("");
}
return true;
}
return this.mOnTouchListener != null && this.mOnTouchListener.onTouch(v, event);
}


实现TextWatcher接口

通过判断文本的长度,来决定图片是否显示。

/**
* @param text         The text the TextView is displaying
* @param start        The offset of the start of the range of the text that was
*                     modified
* @param lengthBefore The length of the former text that has been replaced
* @param lengthAfter  The length of the replacement modified text
*/
@Override
public void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {
if (isFocused()) this.setClearDrawableVisible(text.length() > 0);
}


AIEditText源码

public class AIEditText extends AppCompatEditText implements View.OnTouchListener, View.OnFocusChangeListener, TextWatcher {

private Drawable mClearDrawable;
private OnFocusChangeListener mOnFocusChangeListener;
private OnTouchListener mOnTouchListener;

public AIEditText(Context context) {
super(context);
this.init(context);
}

public AIEditText(Context context, AttributeSet attrs) {
super(context, attrs);
this.init(context);
}

public AIEditText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
this.init(context);
}

/**
* Register a callback to be invoked when focus of this view changed.
*
* @param l The callback that will run.
*/
@Override
public void setOnFocusChangeListener(OnFocusChangeListener l) {
this.mOnFocusChangeListener = l;
}

/**
* Register a callback to be invoked when a touch event is sent to this view.
*
* @param l the touch listener to attach to this view
*/
@Override
public void setOnTouchListener(OnTouchListener l) {
this.mOnTouchListener = l;
}

/**
* @param context
*/
private void init(Context context) {
Drawable drawable = ContextCompat.getDrawable(context, R.drawable.abc_ic_clear_mtrl_alpha);
Drawable wrappedDrawable = DrawableCompat.wrap(drawable);
DrawableCompat.setTint(wrappedDrawable, super.getCurrentHintTextColor());
this.mClearDrawable = wrappedDrawable;
this.mClearDrawable.setBounds(0, 0, this.mClearDrawable.getIntrinsicHeight(), this.mClearDrawable.getIntrinsicHeight());
this.setClearDrawableVisible(false);
super.setOnTouchListener(this);
super.setOnFocusChangeListener(this);
this.addTextChangedListener(this);
}

private void setClearDrawableVisible(boolean visible) {
this.mClearDrawable.setVisible(visible, false);
final Drawable[] compoundDrawables = this.getCompoundDrawables();
this.setCompoundDrawables(compoundDrawables[0], compoundDrawables[1], visible ? this.mClearDrawable : null, compoundDrawables[3]);
}

/**
* @param v     The view the touch event has been dispatched to.
* @param event The MotionEvent object containing full information about
*              the event.
* @return True if the listener has consumed the event, false otherwise.
*/
@Override
public boolean onTouch(View v, MotionEvent event) {
final int x = (int) event.getX();
/**
* x > ableEditWidth (totalWidth - paddingRight - clearDrawableWidth )
* x > ableEditWidth == clearDrawable_X
* so , when clearDrawable is visible and onClick it.
*/
if (this.mClearDrawable.isVisible() && x > this.getWidth() - this.getPaddingRight() - this.mClearDrawable.getIntrinsicWidth()) {
if (event.getAction() == MotionEvent.ACTION_UP) {
this.setError(null);
this.setText("");
}
return true;
}
return this.mOnTouchListener != null && this.mOnTouchListener.onTouch(v, event);
}

/**
* Called when the focus state of a view has changed.
*
* @param v        The view whose state has changed.
* @param hasFocus The new focus state of v.
*/
@Override
public void onFocusChange(View v, boolean hasFocus) {
if (hasFocus) {
this.setClearDrawableVisible(this.getText().length() > 0);
} else {
this.setClearDrawableVisible(false);
}
if (this.mOnFocusChangeListener != null)
this.mOnFocusChangeListener.onFocusChange(v, hasFocus);
}

/**
* @param text         The text the TextView is displaying
* @param start        The offset of the start of the range of the text that was
*                     modified
* @param lengthBefore The length of the former text that has been replaced
* @param lengthAfter  The length of the replacement modified text
*/
@Override
public void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {
if (isFocused()) this.setClearDrawableVisible(text.length() > 0);
}

/**
* @param s
* @param start
* @param count
* @param after
*/
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}

/**
* @param s
*/
@Override
public void afterTextChanged(Editable s) {
}

}


AIEditText效果图



Github传送门

https://github.com/CaMnter/AIEditText
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息