Android自定義PasswordInputView密碼輸入
歡迎來到“實(shí)現(xiàn)自定義密碼輸入控件”這一章節(jié),PasswordInputView定義了密碼輸入的監(jiān)聽,支持直接在布局文件定義屬性值、支持直接獲取密碼輸入的長(zhǎng)度、原始密碼……
先上圖
PasswordInputView是做什么的?
PasswordInputView是一個(gè)自定義密碼輸入的控件,類似支付寶、微信支付的密碼輸入,同時(shí)定義了密碼輸入的監(jiān)聽,支持直接在布局文件定義屬性值、支持直接獲取密碼輸入的長(zhǎng)度、原始密碼等,還可以擴(kuò)展其他方法,請(qǐng)自行實(shí)現(xiàn)。
實(shí)現(xiàn)原理
1.創(chuàng)建一個(gè)類 ‘PasswordInputView' ,讓其繼承EditText,因?yàn)槲覀円獙?shí)現(xiàn)的自定義view是用來密碼輸入的,所以必須繼承EditText。
2.為了在布局(layout)文件(.xml)能直接定義PasswordInputView各個(gè)屬性的值,我們需要定義PasswordInputView帶AttributeSet 參數(shù)的構(gòu)造方法。
public PasswordInputView(Context context, AttributeSet attr) { super(context, attr); init(context, attr); }
3.在'value/attrs.xml'中定義PasswordInputView各個(gè)屬性及其類型,如:
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="Passwordinputview"> <attr name="passwordLength" format="integer"/> <attr name="borderWidth" format="dimension"/> <attr name="borderRadius" format="dimension"/> <attr name="borderColor" format="color"/> <attr name="passwordWidth" format="dimension"/> <attr name="passwordColor" format="color"/> </declare-styleable> </resources>
4.重載OnDraw(Canvas canvas)方法,并在其實(shí)現(xiàn)畫邊框、畫內(nèi)容區(qū)域(以填充模式繪制Paint.Style.FILL)、畫分割線、畫實(shí)心圓點(diǎn)(密碼)。有人可能會(huì)問:畫了邊框、分割線,就可以了,為什么還要畫內(nèi)容區(qū)域?問得好,筆者在實(shí)現(xiàn)過程中也碰到這個(gè)問題,當(dāng)時(shí)沒有畫內(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)對(duì)應(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(); }
動(dòng)態(tài)圖
項(xiàng)目源碼
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- Android中的windowSoftInputMode屬性詳解
- android 使用uinput模擬輸入設(shè)備的方法
- Android WebView 不支持 H5 input type="file" 解決方法
- Android 數(shù)據(jù)存儲(chǔ)之 FileInputStream 工具類及FileInputStream類的使用
- Android編程開發(fā)之EditText中inputType屬性小結(jié)
- Android WebView支持input file啟用相機(jī)/選取照片功能
- Android網(wǎng)頁H5 Input選擇相機(jī)和系統(tǒng)相冊(cè)
- 詳解Android WebView的input上傳照片的兼容問題
- Android InputMethodManager輸入法簡(jiǎn)介
- 從"Show?tabs"了解Android?Input系統(tǒng)
相關(guān)文章
聊聊GridView實(shí)現(xiàn)拖拽排序及數(shù)據(jù)交互的問題
這篇文章主要介紹了聊聊GridView實(shí)現(xiàn)拖拽排序及數(shù)據(jù)交互的問題,整體實(shí)現(xiàn)思路是通過在一個(gè)容器里放置兩個(gè)dragview,DragView里面進(jìn)行View的動(dòng)態(tài)交換以及數(shù)據(jù)交換,具體實(shí)現(xiàn)代碼跟隨小編一起看看吧2021-11-11Android實(shí)現(xiàn)實(shí)時(shí)滑動(dòng)ViewPager的2種方式
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)實(shí)時(shí)滑動(dòng)ViewPager的2種方式,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-10-10android實(shí)現(xiàn)可上下回彈的scrollview
這篇文章主要為大家詳細(xì)介紹了android實(shí)現(xiàn)可上下回彈的scrollview,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04Android仿新浪微博發(fā)送菜單界面的實(shí)現(xiàn)
這篇文章主要介紹了Android仿新浪微博發(fā)送菜單界面的實(shí)現(xiàn),幫助大家更好的理解和學(xué)習(xí)使用Android開發(fā),感興趣的朋友可以了解下2021-04-04Android學(xué)習(xí)筆記--通過Application傳遞數(shù)據(jù)代碼示例
使用Application傳遞數(shù)據(jù)步驟如下:創(chuàng)建新class,取名MyApp,繼承android.app.Application父類,并在MyApp中定義需要保存的屬性2013-06-06深入U(xiǎn)nderstanding Android ContentProvider詳解
本篇文章是對(duì)Android ContentProvider進(jìn)行了詳細(xì)的分析介紹,需要的朋友參考下2013-05-05Android 中 android.view.WindowLeaked的解決辦法
這篇文章主要介紹了Android 中 android.view.WindowLeaked的解決辦法的相關(guān)資料,需要的朋友可以參考下2017-05-05