php支付密码控件,Android 支付密码框控件简单实现

简单的实现支付密码框，可以控制密码个数，背景

效果图奉上

效果图

1.控件主要有7个参数

bgdrawable 背景 (建议透明)

pwdlength 密码长度

splilinewidth 分割线宽度

splilinecolor 分割线颜色

pwdcolor 密码字体颜色

pwdsize 密码字体大小

bgdrawable 第一个为默认背景 第二个为填充背景 (选填，但要填满2个)

import android.content.Context;

import android.text.Editable;

import android.text.InputFilter;

import android.text.InputType;

import android.text.Selection;

import android.text.TextWatcher;

import android.text.method.HideReturnsTransformationMethod;

import android.text.method.PasswordTransformationMethod;

import android.util.AttributeSet;

import android.view.Gravity;

import android.view.View;

import android.view.ViewGroup;

import android.widget.EditText;

import android.widget.LinearLayout;

import android.widget.RelativeLayout;

import android.widget.TextView;

/**

* 支付密码

* Created by yyx on 2016/7/10.

*/

public class PayPwdEditText extends RelativeLayout {

private EditText editText; //文本编辑框

private Context context;

private LinearLayout linearLayout; //文本密码的文本

private TextView[] textViews; //文本数组

private int pwdlength = 6; //密码长度， 默认6

private int[] bgdrawables; //背景图片

private OnTextFinishListener onTextFinishListener;

public PayPwdEditText(Context context) {

this(context, null);

}

public PayPwdEditText(Context context, AttributeSet attrs) {

this(context, attrs, 0);

}

public PayPwdEditText(Context context, AttributeSet attrs, int defStyleAttr) {

super(context, attrs, defStyleAttr);

this.context = context;

}

/**

* @param bgcolor 背景颜色

* @param pwdlength 密码长度

* @param splilinewidth 分割线宽度

* @param splilinecolor 分割线颜色

* @param pwdcolor 密码字体颜色

* @param pwdsize 密码字体大小

* @param bgdrawable 第一个为默认背景 第二个为填充背景 (选填，但要填满2个)

*/

public void initStyle(int bgcolor, int pwdlength, float splilinewidth, int splilinecolor, int pwdcolor, int pwdsize, int... bgdrawable) {

this.pwdlength = pwdlength;

initEdit(bgcolor);

bgdrawables = new int[]{};

if (bgdrawable.length > 1){

bgdrawables = new int[]{bgdrawable[0],bgdrawable[1]};

}

initShowInput(bgcolor, pwdlength, splilinewidth, splilinecolor, pwdcolor, pwdsize);

}

/**

* 初始化编辑框

*

* @param bgcolor

*/

private void initEdit(int bgcolor) {

editText = new EditText(context);

editText.setBackgroundResource(bgcolor);

editText.setCursorVisible(false);

editText.setTextSize(0);

editText.setInputType(InputType.TYPE_NUMBER_VARIATION_PASSWORD | InputType.TYPE_CLASS_NUMBER);

editText.setFilters(new InputFilter[]{new InputFilter.LengthFilter(pwdlength)});

editText.addTextChangedListener(new TextWatcher() {

@Override

public void beforeTextChanged(CharSequence s, int start, int count, int after) {

Editable etext = editText.getText();

Selection.setSelection(etext, etext.length());

}

@Override

public void onTextChanged(CharSequence s, int start, int before, int count) {

}

@Override

public void afterTextChanged(Editable s) {

initDatas(s);

if (s.length() == pwdlength) {

if (onTextFinishListener != null) {

onTextFinishListener.onFinish(s.toString().trim());

}

}

}

});

LayoutParams lp = new LayoutParams(LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);

lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM, RelativeLayout.TRUE);

addView(editText, lp);

}

/**

* @param bgcolor 背景drawable

* @param pwdlength 密码长度

* @param slpilinewidth 分割线宽度

* @param splilinecolor 分割线颜色

* @param pwdcolor 密码字体颜色

* @param pwdsize 密码字体大小

*/

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

//添加密码框父布局

linearLayout = new LinearLayout(context);

linearLayout.setBackgroundResource(bgcolor);

LayoutParams layoutParams = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);

linearLayout.setLayoutParams(layoutParams);

linearLayout.setOrientation(LinearLayout.HORIZONTAL);

addView(linearLayout);

//添加密码框

textViews = new TextView[pwdlength];

LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LayoutParams.MATCH_PARENT);

params.weight = 1;

params.gravity = Gravity.CENTER;

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;

if (bgdrawables.length > 1 && bgdrawables != null){

textViews[i].setBackgroundResource(bgdrawables[0]);

}

textViews[i].setTextSize(pwdsize);

textViews[i].setTextColor(context.getResources().getColor(pwdcolor));

textViews[i].setInputType(InputType.TYPE_NUMBER_VARIATION_PASSWORD | InputType.TYPE_CLASS_NUMBER);

linearLayout.addView(textView, params);

if (i < textViews.length - 1) {

View view = new View(context);

view.setBackgroundColor(context.getResources().getColor(splilinecolor));

linearLayout.addView(view, params2);

}

}

}

/**

* 是否显示明文

*

* @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 {

textViews[i].setTransformationMethod(HideReturnsTransformationMethod.getInstance());

}

}

}

/**

* 设置显示类型

*

* @param type

*/

public void setInputType(int type) {

int length = textViews.length;

for (int i = 0; i < length; i++) {

textViews[i].setInputType(type);

}

}

/**

* 清除文本框

*/

public void clearText() {

editText.setText("");

for (int i = 0; i < pwdlength; i++) {

textViews[i].setText("");

}

}

public void setOnTextFinishListener(OnTextFinishListener onTextFinishListener) {

this.onTextFinishListener = onTextFinishListener;

}

/**

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

*

* @param s

*/

public void initDatas(Editable s) {

if (s.length() > 0) {

int length = s.length();

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));

if (bgdrawables.length > 1 && bgdrawables != null){

textViews[j].setBackgroundResource(bgdrawables[1]);

}

}

} else {

textViews[i].setText("");

if (bgdrawables.length > 1 && bgdrawables != null){

textViews[i].setBackgroundResource(bgdrawables[0]);

}

}

}

} else {

for (int i = 0; i < pwdlength; i++) {

textViews[i].setText("");

if (bgdrawables.length > 1 && bgdrawables != null){

textViews[i].setBackgroundResource(bgdrawables[0]);

}

}

}

}

/**

* 密码

* @return

*/

public String getPwdText() {

if (editText != null)

return editText.getText().toString().trim();

return "";

}

public static int dip2px(Context context, float dipValue) {

final float scale = context.getResources().getDisplayMetrics().density;

return (int) (dipValue * scale + 0.5f);

}

public interface OnTextFinishListener {

void onFinish(String str);

}

}

2.xml 简洁明了 宽高自定

android:id="@+id/et_pay"

android:layout_width="200dp"

android:layout_height="40dp"

/>

3.1 实现不带背景 xml 给个背景

#00000000

#dddddd

#000000

代码实现 参数已在上面给出

PayPwdEditText et_pay = (PayPwdEditText) findViewById(R.id.et_pay);

et_pay.initStyle(R.color.transparent, 6, 1, R.color.light_gray, R.color.black, 20);

效果图如下

不加背景

3.2 加入背景图

去掉xml控件的背景 如果不嫌难看 - -

代码实现相差不大，只是加多2个背景 加宽分割线且透明

et_pay.initStyle(R.color.transparent, 6, 5, R.color.transparent, R.color.black, 20, R.drawable.et_pay_bg, R.drawable.et_pay_bg2);

效果图如下

加背景

4.打印输出

调用

public String getPwdText() {

if (editText != null)

return editText.getText().toString().trim();

return "";

}