歡迎來到“實現(xiàn)自定義密碼輸入控件”這一章節(jié)，PasswordInputView定義了密碼輸入的監(jiān)聽，支持直接在布局文件定義屬性值、支持直接獲取密碼輸入的長度、原始密碼……
公司主營業(yè)務(wù)：成都做網(wǎng)站、成都網(wǎng)站建設(shè)、移動網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實現(xiàn)互聯(lián)網(wǎng)宣傳，提高企業(yè)的競爭能力。創(chuàng)新互聯(lián)是一支青春激揚、勤奮敬業(yè)、活力青春激揚、勤奮敬業(yè)、活力澎湃、和諧高效的團隊。公司秉承以“開放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化，感謝他們對我們的高要求，感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn)，讓我們激情的團隊有機會用頭腦與智慧不斷的給客戶帶來驚喜。創(chuàng)新互聯(lián)推出龍灣免費做網(wǎng)站回饋大家。
先上圖
PasswordInputView是做什么的?
PasswordInputView是一個自定義密碼輸入的控件，類似支付寶、微信支付的密碼輸入，同時定義了密碼輸入的監(jiān)聽，支持直接在布局文件定義屬性值、支持直接獲取密碼輸入的長度、原始密碼等，還可以擴展其他方法，請自行實現(xiàn)。
實現(xiàn)原理
1.創(chuàng)建一個類 ‘PasswordInputView' ，讓其繼承EditText，因為我們要實現(xiàn)的自定義view是用來密碼輸入的，所以必須繼承EditText。
2.為了在布局(layout)文件(.xml)能直接定義PasswordInputView各個屬性的值，我們需要定義PasswordInputView帶AttributeSet 參數(shù)的構(gòu)造方法。
重慶分公司
重慶分公司
public PasswordInputView(Context context, AttributeSet attr) {
super(context, attr);
init(context, attr);
}3.在'value/attrs.xml'中定義PasswordInputView各個屬性及其類型，如：
<?xml version="1.0" encoding="utf-8"?>
4.重載OnDraw(Canvas canvas)方法，并在其實現(xiàn)畫邊框、畫內(nèi)容區(qū)域(以填充模式繪制Paint.Style.FILL)、畫分割線、畫實心圓點（密碼）。有人可能會問：畫了邊框、分割線，就可以了，為什么還要畫內(nèi)容區(qū)域？問得好，筆者在實現(xiàn)過程中也碰到這個問題，當(dāng)時沒有畫內(nèi)容區(qū)域，導(dǎo)致輸入的原始內(nèi)容也顯示出來了(如下異常圖)，所以畫內(nèi)容區(qū)域(以填充模式繪制Paint.Style.FILL)是為了掩蓋原始內(nèi)容不被發(fā)現(xiàn)，切記必不可少。
正確代碼如下：
private void init(Context context, AttributeSet attr) {
TypedArray ta = context.obtainStyledAttributes(attr, R.styleable.Passwordinputview);
try {
passwordLength = ta.getInt(R.styleable.Passwordinputview_passwordLength, passwordLength);
borderWidth = ta.getDimensionPixelSize(R.styleable.Passwordinputview_borderWidth, borderWidth);
borderRadius = ta.getDimensionPixelSize(R.styleable.Passwordinputview_borderRadius, borderRadius);
borderColor = ta.getColor(R.styleable.Passwordinputview_borderColor, borderColor);
passwordWidth = ta.getDimensionPixelSize(R.styleable.Passwordinputview_passwordWidth, passwordWidth);
passwordColor = ta.getColor(R.styleable.Passwordinputview_passwordColor, passwordColor);
} catch (Exception e) {
}
ta.recycle();
borderPaint = new Paint();
borderPaint.setAntiAlias(true);
borderPaint.setColor(borderColor);
borderPaint.setStrokeWidth(borderWidth);
borderPaint.setStyle(Paint.Style.FILL); //以填充模式來畫，防止原始輸入內(nèi)容顯示出來
passwordPaint = new Paint();
passwordPaint.setAntiAlias(true);
passwordPaint.setColor(passwordColor);
passwordPaint.setStrokeWidth(passwordWidth);
}
@Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
int width = getWidth();
int height = getHeight();
//畫邊框
RectF rect = new RectF(0, 0, width, height);
borderPaint.setColor(borderColor);
canvas.drawRoundRect(rect, borderRadius, borderRadius, borderPaint);
//畫內(nèi)容區(qū)域,與上面的borderPaint.setStyle(Paint.Style.FILL)對應(yīng), 防止原始輸入內(nèi)容顯示出來
RectF rectContent = new RectF(rect.left + defaultContentMargin, rect.top + defaultContentMargin, rect.right - defaultContentMargin, rect.bottom - defaultContentMargin);
borderPaint.setColor(Color.WHITE);
canvas.drawRoundRect(rectContent, borderRadius, borderRadius, borderPaint);
//畫分割線:分割線數(shù)量比密碼數(shù)少1
borderPaint.setColor(borderColor);
borderPaint.setStrokeWidth(defaultSplitLineWidth);
for (int i = 1; i < passwordLength; i++) {
float x = width * i / passwordLength;
canvas.drawLine(x, 0, x, height, borderPaint);
}
//畫密碼內(nèi)容
float px, py = height / 2;
float halfWidth = width / passwordLength / 2;
for (int i = 0; i < textLength; i++) {
px = width * i / passwordLength + halfWidth;
canvas.drawCircle(px, py, passwordWidth, passwordPaint);
}
}5.定義“設(shè)置屬性值”的方法，如下
public void setBorderWidth(int borderWidth) {
this.borderWidth = borderWidth;
borderPaint.setStrokeWidth(borderWidth);
postInvalidate();
}動態(tài)圖
項目源碼
點此鏈接
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。
