您的位置: 首页  >  文章  >  【Android】九宫格手势锁简单实现

【Android】九宫格手势锁简单实现

分类: 文章 • 2024-10-19 18:04:04

现在好多应用都可以设置手势锁，Android本身也有提供手势图案锁屏。作为android菜鸟的我，也忍不住想自己动手实现一下。

下面是应用效果图:

【Android】九宫格手势锁简单实现



思路:

1.自定义一个View，重写onDraw方法，利用canvas绘制图形。

2.实现onTouch事件

* Down Move Down  每次判断是否有在手指的位置相应处理。

3.直接在布局文件里面 引用View就可以了。

注意:

1.我在实现的过程中遇到一个问题，导致应用奔溃，日志信息也看不懂。最后是在stackoverflow上找到解决方法的。自定义的View一定要实现 两个参数的构造函数(即 SudokuView(Context context, AttributeSet attrs) )

2.onTouchEvent 方法的返回值一定要是 true，不然就无法相应 Move 和Up 事件了【只会鸟Down～】


下面直接上代码

Cell 类(存储圆点的信息)

[java] view plain copy
 print?
  1. package com.example.mummyding.sudokulock;  
  2.   
  3. /** 
  4.  * Created by mummyding on 15-7-17. 
  5.  */  
  6. public class Cell {  
  7.     private int x;  
  8.     private int y;  
  9.     private boolean isSelected;  
  10.   
  11.     public boolean isSelected() {  
  12.         return isSelected;  
  13.     }  
  14.   
  15.     public void setIsSelected(boolean isSelected) {  
  16.         this.isSelected = isSelected;  
  17.     }  
  18.   
  19.     public int getX() {  
  20.         return x;  
  21.     }  
  22.   
  23.     public void setX(int x) {  
  24.         this.x = x;  
  25.     }  
  26.   
  27.     public int getY() {  
  28.         return y;  
  29.     }  
  30.   
  31.     public void setY(int y) {  
  32.         this.y = y;  
  33.     }  
  34. }  

自定义View

[java] view plain copy
 print?
  1. package com.example.mummyding.sudokulock;  
  2.   
  3. import android.app.Notification;  
  4. import android.content.Context;  
  5. import android.graphics.Canvas;  
  6. import android.graphics.Color;  
  7. import android.graphics.Paint;  
  8. import android.util.AttributeSet;  
  9. import android.util.DisplayMetrics;  
  10. import android.util.Log;  
  11. import android.view.MotionEvent;  
  12. import android.view.View;  
  13. import android.view.WindowManager;  
  14. import android.widget.Toast;  
  15.   
  16. import java.lang.reflect.Type;  
  17.   
  18. /** 
  19.  * Created by mummyding on 15-7-17. 
  20.  */  
  21. public class SudokuView extends View {  
  22.   
  23.     private static final int COUNT = 3;  
  24.     Cell [] cell;  
  25.     int [] selectedCell;  
  26.     int RADIUS ,OFFSET;  
  27.     int ScreenWidth,ScreenHeight;  
  28.     int startX,startY,selectedCount,lastX,lastY;  
  29.     boolean drawFinish ;  
  30.   
  31.     Paint mPaint ;  
  32.   
  33.   
  34.     public SudokuView(Context context, AttributeSet attrs) {  
  35.         super(context, attrs);  
  36.        init(context);  
  37.   
  38.     }  
  39.   
  40.     private void initCell(){  
  41.         //初始化各点  
  42.         for(int i = 0 ; i < COUNT ; i++ )  
  43.             for (int j = 0 ; j < COUNT ; j++) {  
  44.                 cell[i * COUNT + j].setIsSelected(false);  
  45.                 cell[i * COUNT + j].setX(startX + OFFSET * j - RADIUS/2);  
  46.                 cell[i * COUNT + j].setY(startY + OFFSET * i - RADIUS/2);  
  47.             }  
  48.     }  
  49.     private void init(Context context){  
  50.   
  51.         cell = new Cell[COUNT * COUNT];  
  52.         selectedCell = new int[COUNT*COUNT];  
  53.         mPaint = new Paint();  
  54.         //获取屏幕的宽度和高度  
  55.         WindowManager manager = (WindowManager)context.getSystemService(Context.WINDOW_SERVICE);  
  56.         DisplayMetrics dm=new DisplayMetrics();  
  57.         manager.getDefaultDisplay().getMetrics(dm);  
  58.   
  59.         ScreenWidth = dm.widthPixels;  
  60.         ScreenHeight = dm.heightPixels;  
  61.   
  62.   
  63.         this.setMinimumWidth(ScreenWidth);  
  64.         this.setMinimumHeight(ScreenHeight);  
  65.   
  66.         drawFinish = false; //是否绘制完成  
  67.         selectedCount = 0; //已经选中的点个数  
  68.         RADIUS = ScreenWidth / 12; //半径  
  69.         OFFSET = ScreenWidth / 4 ; //点之间的间距  
  70.         startX = OFFSET; //起始点横坐标  
  71.         startY = (ScreenHeight - OFFSET * 2) / 2; //起始点纵坐标  
  72.   
  73.         for(int i = 0 ; i < COUNT*COUNT ; i++){  
  74.             cell[i] = new Cell();  
  75.         }  
  76.         initCell();  
  77.     }  
  78.   
  79.     int inWhichCircle(int x, int y){  
  80.         for(int i = 0 ; i < COUNT*COUNT ; i++){  
  81.             if(cell[i].isSelected() == false){  
  82.                 if((Math.abs(x - cell[i].getX())<RADIUS) && Math.abs(y - cell[i].getY()) < RADIUS){  
  83.                     return i;  
  84.                 }  
  85.             }  
  86.         }  
  87.         return -1;  
  88.     }  
  89.   
  90.     void drawCell(Canvas canvas){  
  91.        for(int i = 0 ; i < COUNT*COUNT ; i++){  
  92.             //选择画笔&&画圆  
  93.             if(cell[i].isSelected()){  
  94.                 mPaint.setColor(Color.GREEN);  
  95.                 mPaint.setStrokeWidth(10);  
  96.                 //画圆  
  97.                 canvas.drawCircle(cell[i].getX(),cell[i].getY(),RADIUS,mPaint);  
  98.                 mPaint.setStrokeWidth(20);  
  99.                 //画点  
  100.                 canvas.drawPoint(cell[i].getX(),cell[i].getY(),mPaint);  
  101.             } else {  
  102.                 mPaint.setColor(Color.WHITE);  
  103.                 mPaint.setStrokeWidth(5);  
  104.                 //画圆  
  105.                 canvas.drawCircle(cell[i].getX(),cell[i].getY(),RADIUS,mPaint);  
  106.                 //画点  
  107.                 canvas.drawPoint(cell[i].getX(),cell[i].getY(),mPaint);  
  108.             }  
  109.   
  110.         }  
  111.     }  
  112.   
  113.     void drawLine(Canvas canvas) {  
  114.         mPaint.setColor(Color.GREEN);  
  115.         mPaint.setStrokeWidth(5);  
  116.         for(int i = 1 ; i < selectedCount ; i++){  
  117.             Cell lastCell = cell[selectedCell[i-1]],thisCell = cell[selectedCell[i]];  
  118.             canvas.drawLine(lastCell.getX(), lastCell.getY(), thisCell.getX(), thisCell.getY(), mPaint);  
  119.         }  
  120.         if(selectedCount !=0 &&(lastX !=0 || lastY != 0)){  
  121.             canvas.drawLine(cell[selectedCell[selectedCount - 1]].getX(), cell[selectedCell[selectedCount - 1]].getY(), lastX, lastY, mPaint);  
  122.         }  
  123.     }  
  124.   
  125.     @Override  
  126.     protected void onDraw(Canvas canvas) {  
  127.         super.onDraw(canvas);  
  128.         mPaint = new Paint();  
  129.         mPaint.setStrokeWidth(5);;  
  130.         mPaint.setAntiAlias(true);  
  131.         mPaint.setColor(Color.GRAY);  
  132.         mPaint.setStyle(Paint.Style.FILL);  
  133.         mPaint.setStyle(Paint.Style.STROKE);  
  134.         drawCell(canvas);  
  135.         drawLine(canvas);  
  136.     }  
  137.   
  138.   
  139.   
  140.     @Override  
  141.     public boolean onTouchEvent(MotionEvent event) {  
  142.         int tmpIndex;  
  143.         switch (event.getAction()){  
  144.             case MotionEvent.ACTION_DOWN:  
  145.                 drawFinish = false;  
  146.                 if((tmpIndex = inWhichCircle((int)event.getX(),(int)event.getY())) != -1){  
  147.                     cell[tmpIndex].setIsSelected(true);  
  148.                     selectedCell[selectedCount++] = tmpIndex;  
  149.                     this.postInvalidate();  
  150.                 }  
  151.                 break;  
  152.             case MotionEvent.ACTION_MOVE:  
  153.                   if(drawFinish == false){  
  154.                     if((tmpIndex = inWhichCircle((int)event.getX(),(int)event.getY())) != -1){  
  155.                         cell[tmpIndex].setIsSelected(true);  
  156.                         selectedCell[selectedCount++] = tmpIndex;  
  157.                     }  
  158.                 }  
  159.                 lastX = (int) event.getX();  
  160.                 lastY = (int) event.getY();  
  161.                 this.postInvalidate();  
  162.                 break;  
  163.             case MotionEvent.ACTION_UP:  
  164.   
  165.                 drawFinish = true;  
  166.                 lastX = lastY = 0;  
  167.                 selectedCount = 0;  
  168.                 initCell();  
  169.                 this.postInvalidate();  
  170.                 break;  
  171.   
  172.         }  
  173.         return true;  
  174.     }  
  175. }  

布局布局[XML]

[java] view plain copy
 print?
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"  
  3.     android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"  
  4.     android:background="@color/material_blue_grey_800"  
  5.     android:paddingRight="@dimen/activity_horizontal_margin"  
  6.     android:paddingTop="@dimen/activity_vertical_margin"  
  7.     android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">  
  8.   
  9.     <com.example.mummyding.sudokulock.SudokuView  
  10.         android:layout_width="wrap_content"  
  11.         android:layout_height="wrap_content"  
  12.         />  
  13. </RelativeLayout>  


完整代码 : https://github.com/MummyDing/SudokuLock


【转载请注明出处】

Author: MummyDing

出处:http://blog.****.net/mummyding/article/details/

相关推荐