简单的实现支付密码框，可以控制密码个数，背景
效果图奉上
效果图
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 简洁明了 宽高自定
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 "";
}