zoukankan      html  css  js  c++  java
  • HTML5 Canvas简简单单实现手机九宫格手势密码解锁

    早上花了一个半小时写了一个基于HTML Canvas的手势解锁,主要是为了好玩,可能以后会用到。

    思路:根据配置计算出九个点的位置,存入一个数组,当然存入数组的顺序的索引是:

       第一行:0   1  2    第二行:3  4  5   第三行:6  7  8

            然后就根据这个坐标数组去绘制九个点

            再则我们需要一个保存选中点的数组,每当touchmove事件就判断当前触摸点和那个点的距离小于圆的半径

        如果为真的话 那么就添加进入选中点的数组

        在绘制过程中就根据该数据去绘制线条。就这么简单 

    上代码:(需要chrome浏览器或者火狐浏览器 模拟手机状态才有触摸效果)

    按 Ctrl+C 复制代码
    按 Ctrl+C 复制代码
  • 相关阅读:
    004_Linux命令之查找与检索
    Linux passwd文件释义
    等保2.0涉及的PostgreSQL
    等保2.0测评:VMware ESXI
    等保2.0测评:Redis 数据库配置
    等保2.0测评之Nginx 中间件
    netcat使用方法
    Zookeeper的功能以及工作原理
    Nginx三大功能
    jellyfin错误 播放错误 该客户端与媒体不兼容,服务器未发送兼容的媒体格式 的解决办法
  • 原文地址:https://www.cnblogs.com/amylis_chen/p/4142588.html
Copyright © 2011-2022 走看看