自定义密码输入框和安全键盘

最新推荐文章于 2022-03-29 14:22:36 发布

置顶

VIP文章 deeny_笛

最新推荐文章于 2022-03-29 14:22:36 发布

阅读量6.0k

点赞数 1

分类专栏： Android开发文章标签：微信支付样式自定义view

本文链接：https://blog.csdn.net/qq_33234564/article/details/78793489

版权

自定义密码输入框和安全键盘

自定义密码输入框

前言：

前边我写过一个高仿微信密码支付框的文章，那篇也是一个仿照微信支付样式的，但是在编码上是通过布局堆出那个样式的，这次是自定义一个控件，可以灵活的定制背景，边框颜色，输入文字的颜色和大小以及可输入的位数。
分析：

首先来看一下密码框的样式

n等分这个布局。明确我们输入的时候是在每个小框中显示的，所以edittext肯定不行。结合我上一篇的布局堆出的密码支付框样式来看。这里应该是水平分布的线性布局，n等分的n个textview和n-1个分割线线性分布。

自定义viewgroup：

自定义viewgroup继承LinearLayout，我们说了，要自己定义样式，颜色等等，那么我们就需要一个让用户自定义这些属性的方法。如下：

 // @param bgdrawable    背景drawable
 // @param pwdlength     密码长度
 // @param splilinewidth 分割线宽度
 // @param splilinecolor 分割线颜色
 // @param pwdcolor      密码字体颜色
 // @param pwdsize       密码字体大小

public void initStyle(int bgdrawable, int pwdlength, float splilinewidth, int splilinecolor, int pwdcolor, int pwdsize) {
    this.pwdlength = pwdlength;
    this.activity = (Activity) context;

    //根据自定义的属性来添加密码框
    initShowInput(bgdrawable, pwdlength, splilinewidth, splilinecolor, pwdcolor, pwdsize);

}

public void initShowInput(int bgcolor, int pwdlength, float slpilinewidth, int splilinecolor, int pwdcolor, int pwdsize) {

this.setOrientation(HORIZONTAL);
this.setBackgroundResource(bgcolor);

//根据长度来初始化tv数组
textViews = new TextView[pwdlength];
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LayoutParams.MATCH_PARENT);
params.weight = 1;
params.gravity = Gravity.CENTER;

//分割线的LayoutParams
LinearLayout.LayoutParams params2 = new LinearLayout.LayoutParams(dip2px(context, slpilinewidth), LayoutParams.MATCH_PARENT);
for (int i = 0; i < textViews.length; i++) {
    final int index = i;
    TextView textView = new TextView(context);
    textView.setGravity(Gravity.CENTER);
    textViews[i] = textView;
    textViews[i].setTextSize(pwdsize);
    textViews[i].setTextColor(context.getResources().getColor(pwdcolor));
    textViews[i].setInputType(InputType.TYPE_NUMBER_VARIATION_PASSWORD | InputType.TYPE_CLASS_NUMBER);
    this.addView(textView, params);


    //设置分割线的宽高，并将其add
    if (i < textViews.length - 1) {
        View view = new View(context);
        view.setBackgroundColor(context.getResources().getColor(splilinecolor));
        this.addView(view, params2);
    }
}
}

以上代码通过我们需要的属性，定义出样式。注释比较详细，不难看懂。到这里，基本的样式出来了，我们可以在布局中使用了。但样式只是基础，后续的操作还有很多。

对外暴露的一些基本操作的方法：

a、输入的字符串的展示：

 * 根据输入字符，显示密码个数
 *
 * @param s

public void initDatas(String s) {
if (s.length() > 0) {

    int length = s.length();
    if(length<=pwdlength){
        for (int i = 0; i < pwdlength; i++) {
            if (i < length) {
                for (int j = 0; j < length; j++) {
                    char ch = s.charAt(j);
                    textViews[j].setText(String.valueOf(ch));
                }
            } else {
                textViews[i].setText("");
            }
        }
        if(length == pwdlength){
            onTextFinishListener.onFinish(s);
        }
    }

} else {
    for (int i = 0; i < pwdlength; i++) {
        textViews[i].setText("");
    }
}
}

b、是否显示明文的控制：

 * 是否显示明文
 *
 * @param showPwd

public void setShowPwd(boolean showPwd) {
    int length = textViews.length;
    for (int i = 0; i < length; i++) {
        if (showPwd) {
            textViews[i].setTransformationMethod(PasswordTransformationMethod.getInstance());
        } else {