欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android程序开发之防止密码输入错误 密码明文显示功能

程序员文章站 2024-02-21 19:32:34
在使用app的时候,首次登录都需要用户输入密码的,有些朋友为了安全起见密码设置的比较长,导致很多次密码都输入错误,严重影响了用户体验效果。这一点移动开发者做好了准备工作,因...

在使用app的时候,首次登录都需要用户输入密码的,有些朋友为了安全起见密码设置的比较长,导致很多次密码都输入错误,严重影响了用户体验效果。这一点移动开发者做好了准备工作,因为手机的私密性比较强,在输入密码的时候,可以显示输入,增强准确性,提升用户体验度。这当然要付出代价的,需要额外的代码编写功能。下面通过本文给大家介绍如何编写密码明文显示的功能,仅供参考。

Android程序开发之防止密码输入错误 密码明文显示功能

本文源码的github下载地址

要点

(1) 重写edittext, 添加提示密码显示和隐藏的图片.

(2) 判断点击位置, 切换edittext的密码显示状态.

(3) 在屏幕旋转或配置改变时, 保留图片的状态信息.

实现只有一个类和两个图片资源, 大家可以*定制.

1. 布局样式

两种密码的显示样式, 一种是常规显示, 一种是textinputlayout显示.

<linearlayout
android:id="@+id/main_ll_container_1"
android:layout_width="match_parent"
android:layout_height="40dp"
android:gravity="center">
<textview
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="密码:"
android:textsize="20sp"/>
<me.chunyu.spike.wcl_password_input_demo.passwordedittext
android:id="@+id/main_pet_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:hint="请输入密码"/>
</linearlayout>
<android.support.design.widget.textinputlayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/main_ll_container_1">
<me.chunyu.spike.wcl_password_input_demo.passwordedittext
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:hint="请输入密码"/>
</android.support.design.widget.textinputlayout>

效果

Android程序开发之防止密码输入错误 密码明文显示功能

2. 提示图标

初始化资源和布局, 获取密码图片的资源, 监听edittext, 有文字时显示图标, 没有文字时隐藏图标.

// 初始化布局
public void initfields(attributeset attrs, int defstyleattr) {
if (attrs != null) {
// 获取属性信息
typedarray styles = getcontext().gettheme().obtainstyledattributes(attrs, r.styleable.passwordedittext, defstyleattr, 0);
try {
// 根据参数, 设置icon
mshowpwdicon = styles.getresourceid(r.styleable.passwordedittext_pet_iconshow, mshowpwdicon);
mhidepwdicon = styles.getresourceid(r.styleable.passwordedittext_pet_iconhide, mhidepwdicon);
} finally {
styles.recycle();
}
}
// 密码状态
setinputtype(editorinfo.type_class_text | editorinfo.type_text_variation_password);
addtextchangedlistener(new textwatcher() {
@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 (s.length() > 0) {
// 有文字时显示指示器
showpasswordvisibilityindicator(true);
} else {
misshowpwdicon = false;
restorepasswordiconvisibility(misshowpwdicon);
showpasswordvisibilityindicator(false); // 隐藏指示器
}
}
@override public void aftertextchanged(editable s) {
}
});
}

setinputtype设置密码状态, type_text_variation_password密文状态.

通过pet_iconshow属性, 可以选择自定义密码提示图片.

3. 监听事件

点击图片, 切换显示或隐藏密码, 获取点击位置, 和图片位置进行比较, 判断事件.

@override public boolean ontouchevent(motionevent event) {
if (mdrawableside == null) {
return super.ontouchevent(event);
}
final rect bounds = mdrawableside.getbounds();
final int x = (int) event.getrawx(); // 点击的位置
int iconx = (int) gettoprightcorner().x;
// icon的位置
int lefticon = iconx - bounds.width();
log.e(tag, "x: " + x + ", lefticon: " + lefticon);
// 大于icon的位置, 才能触发点击
if (x >= lefticon) {
togglepasswordiconvisibility(); // 变换状态
event.setaction(motionevent.action_cancel);
return false;
}
return super.ontouchevent(event);
}

切换明文或密文的密码

// 设置密码指示器的状态
private void restorepasswordiconvisibility(boolean isshowpwd) {
if (isshowpwd) {
// 可视密码输入
setinputtype(editorinfo.type_class_text | editorinfo.type_text_variation_visible_password);
} else {
// 非可视密码状态
setinputtype(editorinfo.type_class_text | editorinfo.type_text_variation_password);
}
// 移动光标
setselection(gettext().length());
}

4. 保存状态

重写savedstate, 在旋转屏幕时, 保存和恢复显示图片信息.

// 存储密码状态, 显示icon的位置
protected static class pwdsavedstate extends basesavedstate {
private final boolean mshowingicon;
private pwdsavedstate(parcelable superstate, boolean showingicon) {
super(superstate);
mshowingicon = showingicon;
}
private pwdsavedstate(parcel in) {
super(in);
mshowingicon = in.readbyte() != 0;
}
public boolean isshowingicon() {
return mshowingicon;
}
@override
public void writetoparcel(parcel destination, int flags) {
super.writetoparcel(destination, flags);
destination.writebyte((byte) (mshowingicon ? 1 : 0));
}
public static final parcelable.creator<pwdsavedstate> creator = new creator<pwdsavedstate>() {
public pwdsavedstate createfromparcel(parcel in) {
return new pwdsavedstate(in);
}
public pwdsavedstate[] newarray(int size) {
return new pwdsavedstate[size];
}
};
}

动画效果

Android程序开发之防止密码输入错误 密码明文显示功能

现在可以把类复制到应用中, 更换图片资源, 替换显示密码框, 给用户更好的移动端体验. 永远追求极致, 追求不凡.

关于android程序开发之防止密码输入错误 密码明文显示功能的相关知识就给大家介绍到这里,希望对大家有所帮助!