好久没写blog了,今天抽空写一个Android里面都能用到的自定义控件,密码输入框。简单介绍一下这个密码输入框的样子吧,当软键盘弹出在输入适合,会有删除的图标显示,点击删除会清空Edittext,后面也会有个眼睛的图标,点击切换是否加密显示和明文显示,当软键盘消失适合,后面那个删除的图标是消失的,其它的功能是和Edittext一样的,毕竟也是对于一个Edittext的自定义控件吧。下面就来看看我截的几个图。
下面就来介绍一下基本实现,完整代码在最后也会给出。
// 按钮宽度dp
private int mWidth;
// 按钮的bitmap
private Bitmap mBitmapInvisible;
private Bitmap mBitmapVisible;
// 按钮是否可见
private boolean isVisible;
// 清除按钮出现动画
private ValueAnimator mAnimatorVisible;
// 消失动画
private ValueAnimator mAnimatorGone;
// 间隔
private int Interval;
// 内容是否是明文
private boolean isPlaintext = false;
// 是否只在获得焦点后显示
private boolean focusedShow = false;
先了解这些变量含义。
/**
* 绘制内容是否是明文的ICON
*/
private void drawVisible(float scale, Canvas canvas) {
int right = (int) (getWidth() + getScrollX() - getmPaddingRight() - Interval - mWidth * (1f - scale) / 2f);
int left = (int) (getWidth() + getScrollX() - getmPaddingRight() - Interval - mWidth * (scale + (1f - scale) / 2f));
int top = (int) ((getHeight() - mWidth * scale) / 2);
int bottom = (int) (top + mWidth * scale);
rect.set(left, top, right, bottom);
if (isPlaintext) {
canvas.drawBitmap(mBitmapVisible, null, rect, null);
} else {
canvas.drawBitmap(mBitmapInvisible, null, rect, null);
}
}
/**
* 只在获得焦点后显示
*/
private void focusedShow() {
focusedShow(isFocusable());
}
/**
* 只在获得焦点后显示
*/
private void focusedShow(boolean focused) {
if (!TextUtil.isEmpty(getText()) && isEditThis() && focused) {
if (!isVisible) {
isVisible = true;
mAnimatorGone.end();
mAnimatorVisible.end();
mAnimatorVisible.start();
invalidate();
}
} else {
if (isVisible) {
isVisible = false;
mAnimatorGone.end();
mAnimatorVisible.end();
mAnimatorGone.start();
invalidate();
}
}
}
// 按钮资源
private final int CLEAR = R.mipmap.icon_clear;
// 动画时长
protected final int ANIMATOR_TIME = 200;
// 按钮左右间隔,单位PX
private int Interval;
// 清除按钮宽度,单位PX
private int mWidthClear;
// 左内边距
private int mPaddingLeft;
// 右内边距
private int mPaddingRight;
// 右侧多出的空间(间隔 + 按钮宽度)
private int mExtraWidth;
// 清除按钮的bitmap
private Bitmap mBitmapClear;
// 清除按钮出现动画
private ValueAnimator mAnimatorVisible;
// 消失动画
private ValueAnimator mAnimatorGone;
// 是否显示的记录
private boolean isVisible = false;
// 右边添加其他按钮时使用
private int mRight = 0;
/**
* EditText内容变化的监听
*/
@Override
protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {
if (getInputType() == (InputType.TYPE_NUMBER_FLAG_DECIMAL | InputType.TYPE_CLASS_NUMBER) && !TextUtils.isEmpty(text) && text.charAt(0) == '.') {
if (text.length() == 1) {
setText("0.");
} else {
setText(getText().replace(0, 0, "0."));
}
setSelection(getText().length());
}
super.onTextChanged(text, start, lengthBefore, lengthAfter);
if (text.length() > 0 && isFocused() && isEditThis()) {
if (!isVisible) {
isVisible = true;
startVisibleAnimator();
}
} else {
if (isVisible) {
isVisible = false;
startGoneAnimator();
}
}
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int additional = 0;
if (getGravity() == Gravity.CENTER || getGravity() == Gravity.CENTER_HORIZONTAL) {
additional = mExtraWidth + mRight + mPaddingRight;
}
// 设置内边距
setPadding(mPaddingLeft + additional, getPaddingTop(), mExtraWidth + mRight + mPaddingRight, getPaddingBottom());
if (!TextUtil.isEmpty(getText()) && isEditThis()) {
if (!isVisible) {
isVisible = true;
startVisibleAnimator();
}
} else {
if (isVisible) {
isVisible = false;
startGoneAnimator();
}
}
}
/**
* 晃动动画
*
* @param counts 0.5秒钟晃动多少下
*/
private Animation shakeAnimation(int counts) {
Animation translateAnimation = new TranslateAnimation(0, 10, 0, 0);
translateAnimation.setInterpolator(new CycleInterpolator(counts));
translateAnimation.setDuration(500);
return translateAnimation;
}
/**
* 给图标染上当前提示文本的颜色并且转出Bitmap
*/
public Bitmap createBitmap(int resources, Context context) {
final Drawable drawable = ContextCompat.getDrawable(context, resources);
final Drawable wrappedDrawable = DrawableCompat.wrap(drawable);
DrawableCompat.setTint(wrappedDrawable, getCurrentHintTextColor());
return drawableToBitmap(wrappedDrawable);
}
/**
* 触控执行的监听
*/
@Override
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_UP) {
boolean touchable = (getWidth() - mPaddingRight - Interval - mRight - mWidthClear < event.getX())
&& (event.getX() < getWidth() - mPaddingRight - Interval - mRight);
if (touchable && isVisible) {
setError(null);
this.setText("");
}
}
return super.onTouchEvent(event);
}
其实主要的就是一些绘制和一些动画的显示,基本原理还是遵从Edittext的属性来的。
完整代码下载地址:
http://download.csdn.net/download/greatdaocaoren/10106019
有兴趣可以看看下面服务号和订阅号: