android文本框密码格式,android 密码输入框

1.效果如下

306347510301723728.png

2.实现方式

继承EditText,绘制矩形边框，绘制内部5条线， 绘制中间圆点。

3.代码如下

public class MyEditTest extends AppCompatEditText {

private static final String TAG = "MyEditTest";

private int width;

private int height;

private int divideLineWStartX;

private int firstCircleW;

private int maxCount=6;

private int inputLength;

private Paint pLine;

private Paint pCircle;

private Context context;

public MyEditTest(Context context) {

this(context,null);

}

public MyEditTest(Context context, AttributeSet attrs) {

super(context, attrs);

this.context=context;

this.setBackgroundColor(Color.TRANSPARENT);//========================>>1

this.setCursorVisible(false);//========================================>>2

initPaint();

}

private void initPaint(){

pLine=new Paint();

pLine.setColor(Color.parseColor("#666666"));

pLine.setAntiAlias(true);

pLine.setStyle(Paint.Style.STROKE);

pCircle=new Paint();

pCircle.setColor(Color.parseColor("#333333"));

pCircle.setAntiAlias(true);

pCircle.setStyle(Paint.Style.FILL);

}

@Override

protected void onSizeChanged(int w, int h, int oldw, int oldh) {

super.onSizeChanged(w, h, oldw, oldh);

height=h;

width=w;

//第一条竖线 x位置

divideLineWStartX = w / maxCount;

//第一个圆x 位置

firstCircleW=divideLineWStartX/2;

}

@Override

protected void onDraw(Canvas canvas) {

// super.onDraw(canvas);=======================================>>3

drawRect(canvas);

drawLine(canvas);

drawCircle(canvas);

}

private void drawLine(Canvas canvas) {

// 通过循环画出每个分割线

for (int i = 0; i < maxCount - 1; i++) {

canvas.drawLine((i + 1) * divideLineWStartX,

0,

(i + 1) * divideLineWStartX,

height,

pLine);

}

}

private void drawCircle(Canvas canvas) {

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

canvas.drawCircle(firstCircleW + i * 2 * firstCircleW,

height/2,

dp2px(context,5),

pCircle);

}

}

private void drawRect(Canvas canvas) {

canvas.drawRoundRect(new RectF(0,0,width,height),dp2px(context,2),dp2px(context,2),pLine);

}

@Override

protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {

super.onTextChanged(text, start, lengthBefore, lengthAfter);

inputLength=text.length();

if (inputLength>=6){

this.setEnabled(false);

backData.onDataBack(text.toString());

}

invalidate();

}

public void setBackData(OnBackData backData) {

this.backData = backData;

}

/**

* 根据手机的分辨率从 dp 的单位 转成为 px(像素)

*/

public static int dp2px(Context context, float dpValue) {

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

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

}

private OnBackData backData;

public interface OnBackData{

/**

* 6位数字密码

* @param pwd

*/

void onDataBack(String pwd);

}

}

4.绘制矩形边框、绘制内部5竖条线倒挺容易，在绘制圆点时，需要重写“onTextChanged”方法，在里面判断输入字符的长度，根据字符的长度，绘制圆点的个数。

@Override

protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {

super.onTextChanged(text, start, lengthBefore, lengthAfter);

inputLength=text.length();

if (inputLength>=6){

this.setEnabled(false);

backData.onDataBack(text.toString());

}

invalidate();

}

5.注意“1”处，去掉edittext自带的红色背景线，“2”处去掉不断闪烁的焦点指示图标，“3”处“ super.onDraw(canvas);”如果不注释掉，会绘制原本输入的字符。