快捷導(dǎo)航

android 仿ios數(shù)字密碼解鎖界面的實例

更新時間：2017年12月22日 14:08:10 作者：AndyRenJie

下面小編就為大家分享一篇android 仿ios數(shù)字密碼解鎖界面的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

如下所示：

每個Android開發(fā)人員都知道，現(xiàn)在android的解鎖最常用的就是九宮格解鎖，ios的解鎖常用的是數(shù)字密碼解鎖。而我們在開發(fā)工程中，很多時候，都需要android和ios進行結(jié)合。有的時候我們就需要把我們的解鎖界面弄成像ios一樣的數(shù)字鍵盤。

這里我就實現(xiàn)了一個仿照ios的數(shù)字密碼解鎖界面。在這里我采用了兩種方式來實現(xiàn)，第一種就是使用自定義控件的形式，第二種就是使用我們的布局來實現(xiàn)的。這里我就著重講一下使用自定義控件形式實現(xiàn)的思路。至于使用布局文件實現(xiàn)的方式，我就不進行具體的講解了，具體的在后面我會上傳源碼供大家下載進行研究學(xué)習(xí)。

當(dāng)然，我的能力有限，可能你們覺得我的方式不好，那么你們就給我提出來，看看具體你們覺得怎么實現(xiàn)才好，我們一起研究學(xué)習(xí)。

好了，廢話不多說了，現(xiàn)在就來講解一下，我所使用自定義控件的實現(xiàn)方法：

1.最主要還是實現(xiàn)自定義數(shù)字鍵盤(一個自定義View的控件)：

1.繪制數(shù)字

// 繪制第一排1,2,3
 canvas.drawText("1", first_x, 40 + first_y, paint);
 canvas.drawText("2", first_x * 2, 40 + first_y, paint);
 canvas.drawText("3", first_x * 3, 40 + first_y, paint);
 // 繪制第2排4,5,6
 canvas.drawText("4", first_x, 40 + first_y + first_x, paint);
 canvas.drawText("5", first_x * 2, 40 + first_y + first_x, paint);
 canvas.drawText("6", first_x * 3, 40 + first_y + first_x, paint);
 // 繪制第3排7,8,9
 canvas.drawText("7", first_x, 40 + first_y + first_x * 2, paint);
 canvas.drawText("8", first_x * 2, 40 + first_y + first_x * 2, paint);
 canvas.drawText("9", first_x * 3, 40 + first_y + first_x * 2, paint);
 // 繪制第4排0
 canvas.drawText("0", first_x * 2, 40 + first_y + first_x * 3, paint);

2.繪制好數(shù)字后，我們需要在每一個數(shù)字外面添加一層圓，繪制圓

//依次繪制第一排的圓
 canvas.drawCircle(first_x+10, 40 + first_y - 15, 50, paint);
 canvas.drawCircle(first_x*2+10, 40 + first_y - 15, 50, paint);
 canvas.drawCircle(first_x*3+10, 40 + first_y - 15, 50, paint);
 //依次繪制第2排的圓
 canvas.drawCircle(first_x+10, 40 + first_y + first_x - 15, 50, paint);
 canvas.drawCircle(first_x*2+10, 40 + first_y + first_x - 15, 50, paint);
 canvas.drawCircle(first_x*3+10, 40 + first_y + first_x - 15, 50, paint);
 //依次繪制第3排的圓
 canvas.drawCircle(first_x+10, 40 + first_y + first_x * 2 - 15, 50, paint);
 canvas.drawCircle(first_x*2+10, 40 + first_y + first_x * 2 - 15, 50, paint);
 canvas.drawCircle(first_x*3+10, 40 + first_y + first_x * 2 - 15, 50, paint);
 //繪制最后一個圓
 canvas.drawCircle(first_x*2+10, 40 + first_y + first_x * 3 - 15, 50, paint);

3.點擊數(shù)字后，我們給一個不同的效果，讓用戶知道自己點擊了該數(shù)字，這里我是吧外面的圓的顏色改為了黃色

//判斷是否點擊數(shù)字
 if(circle_x > 0 && circle_y > 0){//點擊
 if(type == 0){//按下刷新
 paint.setColor(Color.YELLOW);//設(shè)置畫筆顏色
 canvas.drawCircle(circle_x, circle_y, 50, paint);//繪制圓
 }else if(type == 1){//彈起刷新
 paint.setColor(Color.WHITE);//設(shè)置畫筆顏色
 canvas.drawCircle(circle_x, circle_y, 50, paint);//繪制圓
 //繪制完成后,重置
 circle_x = 0; circle_y = 0;
 }
 }

4.最后就是判斷點擊的數(shù)字

/*
 * 判斷點擊的是哪一個數(shù)字圓
 */
private void handleDown(float x, float y){
 //判斷點擊的是那一列的數(shù)據(jù)
 if(xs[0] - 50 <= x && x <= xs[0] + 50){//第一列
 //獲取點擊處的圓心橫坐標(biāo)
 circle_x = xs[0];
 //判斷點擊的是哪一排
 if(ys[0] - 50 <= y && ys[0] + 50 >= y){//第1排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[0];
 number = 1;//設(shè)置點擊的數(shù)字
 }else if(ys[1] - 50 <= y && ys[1] + 50 >= y){//第2排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[1];
 number = 4;//設(shè)置點擊的數(shù)字
 }else if(ys[2] - 50 <= y && ys[2] + 50 >= y){//第3排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[2];
 number = 7;//設(shè)置點擊的數(shù)字
 }
 }else if(xs[1] - 50 <= x && x <= xs[1] + 50){//第2列
 //獲取點擊處的圓心橫坐標(biāo)
 circle_x = xs[1];
 //判斷點擊的是哪一排
 if(ys[0] - 50 <= y && ys[0] + 50 >= y){//第1排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[0];
 number = 2;//設(shè)置點擊的數(shù)字
 }else if(ys[1] - 50 <= y && ys[1] + 50 >= y){//第2排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[1];
 number = 5;//設(shè)置點擊的數(shù)字
 }else if(ys[2] - 50 <= y && ys[2] + 50 >= y){//第3排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[2];
 number = 8;//設(shè)置點擊的數(shù)字
 }else if(ys[3] - 50 <= y && ys[3] + 50 >= y){//第4排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[3];
 number = 0;//設(shè)置點擊的數(shù)字
 }
 }else if(xs[2] - 50 <= x && x <= xs[2] + 50){//第3列
 //獲取點擊處的圓心橫坐標(biāo)
 circle_x = xs[2];
 //判斷點擊的是哪一排
 if(ys[0] - 50 <= y && ys[0] + 50 >= y){//第1排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[0];
 number = 3;//設(shè)置點擊的數(shù)字
 }else if(ys[1] - 50 <= y && ys[1] + 50 >= y){//第2排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[1];
 number = 6;//設(shè)置點擊的數(shù)字
 }else if(ys[2] - 50 <= y && ys[2] + 50 >= y){//第3排
 //獲取點擊的數(shù)字圓的圓心縱坐標(biāo)
 circle_y = ys[2];
 number = 9;//設(shè)置點擊的數(shù)字
 }
 }
 sendAccessEvent(R.string.numeric_keyboard_down);
 type = 0;//按下刷新
 //繪制點擊時的背景圓
 invalidate();
}

好了，大概我的就是這樣了。順帶提一下，我這里上面4個顯示密碼的控件也是采用的自定義控件的方式，使用線程實現(xiàn)輸入數(shù)字后1秒后用密碼字符替換輸入的數(shù)字。(有人可能會說系統(tǒng)的EditText控件設(shè)置樣式為密碼也可以實現(xiàn)，這里我想說的是，不可以的，至少我試了是不行的)

以上這篇android 仿ios數(shù)字密碼解鎖界面的實例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章: