android自定义View——仿九宫格解锁

switch (event.getAction()) {

case MotionEvent.ACTION_DOWN:

isPressFlag = true;

for (int i = 0; i < mPointData.size(); i++) {

myPoint currentPoint = mPointData.get(i);

if (checkIsInCircle(downPointX, downPointY, currentPoint.x, currentPoint.y, outCircleR)) {

//记录按下的那个点，等下要以密码的形式返回出去

mSelectData.add(currentPoint);

currentPoint.state = myPoint.STATE_DOWN;

}

}

invalidate();

break;

case MotionEvent.ACTION_MOVE:

for (int i = 0; i < mPointData.size(); i++) {

myPoint currentPoint = mPointData.get(i);

if (checkIsInCircle(downPointX, downPointY, currentPoint.x, currentPoint.y, outCircleR)) {

//防止反复记下重复点

if (!mSelectData.contains(currentPoint)) {

mSelectData.add(currentPoint);

currentPoint.state = myPoint.STATE_DOWN;

}

}

}

invalidate();

break;

case MotionEvent.ACTION_UP:

isPressFlag = false;

if (mSelectData != null && mSelectData.size() != 0) {

//抬起的时候，密码回调

StringBuilder stringBuilder = new StringBuilder();

for (int i = 0; i < mSelectData.size(); i++) {

stringBuilder.append(mSelectData.get(i).i);

}

// System.out.println(“stringBuilder.toString() ->” + stringBuilder.toString());

mOnTouchResult.result(stringBuilder.toString());

}

//清除状态

postDelayed(new Runnable() {

@Override

public void run() {

clearState();

invalidate();

}

},1000);

break;

}

return true;

}

private void clearState() {

isWrongFlag = false;

mSelectData.clear();

for (int i = 0; i < mPointData.size(); i++) {

mPointData.get(i).state = myPoint.STATE_NORMAL;

}

}

//检查是否在圈内

private boolean checkIsInCircle(float downPointX, float downPointY, float centerX, float centerY, float R) {

return Math.sqrt(Math.pow(downPointX - centerX, 2) + Math.pow(downPointY - centerY, 2)) < R;

}

//初始化画笔

private Paint initPaint(int color) {

Paint paint = new Paint();

paint.setDither(true);

paint.setAntiAlias(true);

paint.setStyle(Paint.Style.STROKE);

paint.setColor(color);

paint.setStrokeWidth(5);

return paint;

}

//画圈

private void drawCircle(Canvas canvas) {

System.out.println(“drawCircle mSelectData ->” + mSelectData);

System.out.println(“drawCircle mPointData ->” + mPointData);

for (int i = 0; i < mPointData.size(); i++) {

if (mPointData.get(i).state == myPoint.STATE_NORMAL) {

canvas.drawCircle(mPointData.get(i).x, mPointData.get(i).y, outCircleR, normalPaint);

canvas.drawCircle(mPointData.get(i).x, mPointData.get(i).y, inCircleR, normalPaint);

} else if (mPointData.get(i).state == myPoint.STATE_DOWN) {

canvas.drawCircle(mPointData.get(i).x, mPointData.get(i).y, outCircleR, downPaint);

canvas.drawCircle(mPointData.get(i).x, mPointData.get(i).y, inCircleR, downPaint);

}else if (mPointData.get(i).state == myPoint.STATE_ERROR) {

canvas.drawCircle(mPointData.get(i).x, mPointData.get(i).y, outCircleR, errorPaint);

canvas.drawCircle(mPointData.get(i).x, mPointData.get(i).y, inCircleR, errorPaint);

}

}

}

//初始化九个单元格

private void initCell() {

mPointData = new ArrayList<>();

//获取布局宽高

int width = getWidth();

int height = getHeight();

//第一个点的位置

float possionX = 0;

float possionY = 0;

//横竖屏兼容,计算第一个点的坐标

if (width < height) {

possionX = width * 1.0f / 6;

possionY = (height - width) * 1.0f / 2 + width * 1.0f / 6;

height = width;

} else {

possionX = (width - height) * 1.0f / 2 + height * 1.0f / 6;

possionY = height * 1.0f / 6;

width = height;

}

//设置内外圆的半径

outCircleR = width * 1.0f / 12;

inCircleR = width * 1.0f / 50;

//循环产生九个点

int n = 1;

for (int i = 0; i < 3; i++) {

for (int j = 0; j < 3; j++) {

mPointData.add(new myPoint(possionX + j * width * 1.0f / 3, possionY + i * height * 1.0f / 3, n++));

}

}

}

public void setOnTouchResultListener(onTouchResult onTouchResult) {

this.mOnTouchResult = onTouchResult;

}

public interface onTouchResult {

void result(String s);

}

public void pwdError() {

isWrongFlag = true;

for (int i = 0; i < mSelectData.size(); i++) {

mSelectData.get(i).state = myPoint.STATE_ERROR;

}

System.out.println(“mSelectData ->” + mSelectData);

invalidate();

}

}

//创建一个点类 里面主要存储 点的位置和序号 这里为了减少代码量 我就不用 get 和 set 方法了

class myPoint {

public float x;

public float y;

public int i;

public static final int STATE_NORMAL = 0;

public static final int STATE_DOWN = 1;

public static final int STATE_ERROR = 2;

public int state = STATE_NORMAL;

public myPoint(float x, float y, int i) {

this.x = x;

this.y = y;

this.i = i;

}

@Override

public String toString() {

return “myPoint{” +

“x=” + x +

“, y=” + y +

“, i=” + i +

“, state=” + state +

‘}’;

}

}

二、编写xml文件

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”

xmlns:tools=“http://schemas.android.com/tools”

android:layout_width=“match_parent”

android:layout_height=“match_parent”

tools:context=“.MainActivity”>

<com.wust.nineview.selfNineView

android:id=“@+id/snv_selfnineview”

android:layout_width=“match_parent”

android:layout_height=“match_parent”/>

三、调用

package com.wust.nineview;

import androidx.appcompat.app.AppCompatActivity;

import android.content.IntentFilter;

import android.os.Bundle;

import android.view.View;

import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

private selfNineView snv_selfnineview;

private final static String CORRECT_PWD = “13579”;

private Toast mToast;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

snv_selfnineview = findViewById(R.id.snv_selfnineview);

snv_selfnineview.setOnTouchResultListener(new selfNineView.onTouchResult() {

@Override

public void result(String s) {

if (CORRECT_PWD.equals(s)){

showToast(“密码输入正确”);

}else {

showToast(“密码输入错误，请重试”);

snv_selfnineview.pwdError();

}

}

});

}

private void showToast(String text) {

runOnUiThread(new Runnable() {

@Override

public void run() {

if (mToast == null){

mToast = Toast.makeText(MainActivity.this,null,Toast.LENGTH_SHORT);

}

mToast.setText(text);

mToast.show();

}

});

}

}

代码分析

====

在这个自定义View里我觉得我印象最深的是这么两点。

1、箭头怎么画，那个画箭头的函数怎么写出来的？

解：大家可以结合这张图对照着我写的函数进行分析。

2、引用对象的赋值是引用的拷贝，即地址的拷贝，改变任意一个引用对象的值，都是在改变原型值。

解：下面这个函数改变的是 mSelectData 列表中 myPoint 引用对象的值，你会发现，我们绘制的时候是用 mPointData 列表中的 myPoint 引用对象画的，说明这两个引用变量指向的是同一块内存地址，任意一方对该地址内容进行修改，都会导致其内容变化。参考文章 java中调用方法传值问题详解

public void pwdError() {

isWrongFlag = true;

for (int i = 0; i < mSelectData.size(); i++) {

mSelectData.get(i).state = myPoint.STATE_ERROR;

}

System.out.println(“mSelectData ->” + mSelectData);

invalidate();

}

最后

愿你有一天，真爱自己，善待自己。

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化学习资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！