Android自定義密碼輸入框

1.概述

? ? ? ?前一段時(shí)間一直在封閉開(kāi)發(fā),其實(shí)技術(shù)難度不大,開(kāi)發(fā)也就10天左右租谈,由于產(chǎn)品是新來(lái)的,中間需求一變?cè)僮冃妫瑥拈_(kāi)始封閉到產(chǎn)品上線最終耗時(shí)一個(gè)月垦垂。封閉期間把寫的比較有意思的兩個(gè)自定義view記錄下來(lái)宦搬。

? ? ? ? 其實(shí)第一個(gè)自定義view是密碼輸入框,下面來(lái)看一個(gè)效果(從MP4轉(zhuǎn)換成gif效果差別好大)劫拗。

輸入框效果動(dòng)圖

2.實(shí)現(xiàn)

a.思路

? ? ? ?看到UE圖的第一眼间校,心里萬(wàn)馬奔騰,它和一般的密碼輸入框還不一樣页慷,首先它是有邊框的憔足,其次它的待輸入狀態(tài),已輸入狀態(tài)和未輸入狀態(tài)中的背景顏色還不一樣酒繁。最后滓彰,本著能夠以后拓展又不重復(fù)造輪子的情況下,就自定義view吧州袒,又為了節(jié)約時(shí)間成本揭绑,就自定義EditText吧??。

b.實(shí)現(xiàn)

其實(shí)這個(gè)效果實(shí)現(xiàn)起來(lái)也很簡(jiǎn)單郎哭,主要是計(jì)算出第一個(gè)框的起始點(diǎn)的橫坐標(biāo)即可他匪,其余框的起始坐標(biāo)根據(jù)第一個(gè)框的起始點(diǎn)坐標(biāo)計(jì)算即可。下面說(shuō)一下我這個(gè)自定義密碼輸入框?qū)崿F(xiàn)的功能:①矩形的高度(PS:這里矩形的寬度我默認(rèn)和高度一樣夸研,想寬高不相等的話我下期再優(yōu)化)②輸入框的數(shù)量③輸入框默認(rèn)邊框的寬度④輸入框默認(rèn)邊框的顏色⑤輸入框默認(rèn)的填充色⑥待輸入框邊框的顏色⑦待輸入框的填充色⑧輸入框之間的間距⑨輸入框內(nèi)文字的大邪蠲邸⑩輸入框內(nèi)文字的顏色?是否繪制邊框?是否需要隱藏輸入信息?圓的半徑?圓的顏色。具體如下:

自定義輸入框需要配置的參數(shù)

需要的參數(shù)寫好以后亥至,下面都是基本的繪制矩形以及繪制文字函數(shù)悼沈。接下來(lái),主要講解一下其中要注意的要點(diǎn):①第一個(gè)輸入框起始坐標(biāo)的計(jì)算姐扮。

第一個(gè)輸入框的起始橫坐標(biāo)

②繪制輸入框的邊框時(shí)絮供,如果Y軸坐標(biāo)從0開(kāi)始時(shí),則矩形的上邊框和左右及下邊框粗細(xì)不一樣溶握,所以為了達(dá)到粗細(xì)一樣的效果杯缺,Y軸坐標(biāo)從1開(kāi)始繪制

Y軸往下偏移1個(gè)單位

③繪制文字時(shí)要計(jì)算好文字的baseline(基準(zhǔn)線),不然文字不會(huì)在輸入框內(nèi)居中睡榆。

baseline計(jì)算

④自定義EditText首先要隱藏光標(biāo)以及下劃線萍肆。

光標(biāo)及下劃線隱藏

3最后

完整代碼傳送門:CustomView/CEditText.java at master · xiaschina/CustomView · GitHub

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市胀屿,隨后出現(xiàn)的幾起案子塘揣,更是在濱河造成了極大的恐慌,老刑警劉巖宿崭,帶你破解...
    沈念sama閱讀 211,496評(píng)論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件亲铡,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)奖蔓,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,187評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門赞草,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人吆鹤,你說(shuō)我怎么就攤上這事厨疙。” “怎么了疑务?”我有些...
    開(kāi)封第一講書人閱讀 157,091評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵沾凄,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我知允,道長(zhǎng)撒蟀,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書人閱讀 56,458評(píng)論 1 283
  • 正文 為了忘掉前任温鸽,我火速辦了婚禮保屯,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘涤垫。我一直安慰自己配椭,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,542評(píng)論 6 385
  • 文/花漫 我一把揭開(kāi)白布雹姊。 她就那樣靜靜地躺著,像睡著了一般衡楞。 火紅的嫁衣襯著肌膚如雪吱雏。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書人閱讀 49,802評(píng)論 1 290
  • 那天瘾境,我揣著相機(jī)與錄音歧杏,去河邊找鬼。 笑死迷守,一個(gè)胖子當(dāng)著我的面吹牛犬绒,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播兑凿,決...
    沈念sama閱讀 38,945評(píng)論 3 407
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼凯力,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了礼华?” 一聲冷哼從身側(cè)響起咐鹤,我...
    開(kāi)封第一講書人閱讀 37,709評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎圣絮,沒(méi)想到半個(gè)月后祈惶,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,158評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,502評(píng)論 2 327
  • 正文 我和宋清朗相戀三年捧请,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了凡涩。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,637評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡疹蛉,死狀恐怖活箕,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情氧吐,我是刑警寧澤讹蘑,帶...
    沈念sama閱讀 34,300評(píng)論 4 329
  • 正文 年R本政府宣布,位于F島的核電站筑舅,受9級(jí)特大地震影響座慰,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜翠拣,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,911評(píng)論 3 313
  • 文/蒙蒙 一版仔、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧误墓,春花似錦蛮粮、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書人閱讀 30,744評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至欣范,卻和暖如春变泄,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背恼琼。 一陣腳步聲響...
    開(kāi)封第一講書人閱讀 31,982評(píng)論 1 266
  • 我被黑心中介騙來(lái)泰國(guó)打工妨蛹, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人晴竞。 一個(gè)月前我還...
    沈念sama閱讀 46,344評(píng)論 2 360
  • 正文 我出身青樓蛙卤,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親噩死。 傳聞我的和親對(duì)象是個(gè)殘疾皇子颤难,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,500評(píng)論 2 348