仿网易邮箱大师手势解锁 Handle Lock(Swift版)免费下载源代码

分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友 微信微信
查看查看184 回复回复2 收藏收藏 分享淘帖 转播转播 分享分享 微信
查看: 184|回复: 2
收起左侧

仿网易邮箱大师手势解锁 Handle Lock(Swift版)免费下载源代码

[复制链接]
SwiftRobot 发表于 2016-8-13 01:11:55 | 显示全部楼层 |阅读模式
快来登录
获取优质的苹果资讯内容
收藏热门的iOS等技术干货
拷贝下载Swift Demo源代码
订阅梳理好了的知识点专辑
每次打开网易邮箱大师进来第一个界面就是解锁,这种设计很好的保护用户的隐私。手势解锁也是一种很好的密码方式,今天我就介绍一下这个手势解锁。

先看下效果,我在网易邮箱大师的bandle里没有找到解锁相关的图片,感觉有可能是自己画的,这里我的图片是东凑西凑的,大家凑合看吧。

仿网易邮箱大师手势解锁(Swift版)免费下载源代码

仿网易邮箱大师手势解锁 Handle Lock(Swift版)免费下载源代码 - 敏捷大拇指 - 仿网易邮箱大师手势解锁(Swift版)免费下载源代码

效果

以下是我构建的思路步骤。




1、创建按钮

[Swift] 纯文本查看 复制代码
  func initButtons() {

        let btnW: CGFloat = 80
        let rowCount: CGFloat = 3
        let gap = (self.frame.width - btnW * rowCount) / (rowCount + 1)
        for i in 0 ..< 9 {
            let list = CGFloat(i % 3 ) // 列
            let row = CGFloat( i / 3 ) // 行
            let button = UIButton()
            button.frame = CGRectMake((btnW + gap) * list + gap, (btnW + gap) * row + 20 + topLabel.frame.maxY , btnW, btnW)
            button.tag = i
            button.setBackgroundImage(UIImage(named: "handle_normal"), forState: .Normal)
            button.setBackgroundImage(UIImage(named: "handle_selected"), forState: .Selected)
            button.userInteractionEnabled = false
            self.addSubview(button)
        }

    }





2、设置起点和按钮选中状态

[Swift] 纯文本查看 复制代码
  override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {

        guard result else {
            return
        }

        let point = pointWithTouch(touches)
        if let btn = buttonWithPoint(point) {
            if !btn.selected {
                btn.selected = true
                buttons.append(btn)
            }
        }
    }





3、绘制轨迹

移动中添加轨迹上的按钮到数组,并且不能重复添加,最后调用self.setNeedsDisplay()绘制轨迹

[Swift] 纯文本查看 复制代码
   override func touchesMoved(touches: Set<UITouch>, withEvent event: UIEvent?) {
        guard result else {
            return
        }
        let point = pointWithTouch(touches)
        movePoint = point
        if let btn = buttonWithPoint(point) {
            if !btn.selected {
                btn.selected = true
                if !buttons.contains(btn) {
                    buttons.append(btn)
                }
            }
        }
        self.setNeedsDisplay()
    }





4、重新绘制

结束后记录按钮的顺序,并保存到本地,最后清空数组重新绘制一下

[Swift] 纯文本查看 复制代码
    override func touchesEnded(touches: Set<UITouch>, withEvent event: UIEvent?) {
        guard result else {
            return
        }
        var str = ""
        for button in buttons {
            button.selected = false
            str += String(button.tag)
        }

        if handleResult(str) {
            result = true
            buttons.removeAll()
            self.setNeedsDisplay()
            handleBlock?(result: true)
        }else {
            for button in buttons {
                button.setBackgroundImage(UIImage(named: "handle_warning"), forState: .Normal)
            }
            result = false
            self.setNeedsDisplay()
            addAnimation()
            dispatch_after(dispatch_time(DISPATCH_TIME_NOW,
                Int64(2.0 * Double(NSEC_PER_SEC))), dispatch_get_main_queue()) { () -> Void in
                    self.result = true
                    for button in self.buttons {
                        button.setBackgroundImage(UIImage(named: "handle_normal"), forState: .Normal)
                    }
                    self.buttons.removeAll()
                    self.setNeedsDisplay()
            }
            handleBlock?(result: false)
        }
    }





5、drawRect方法

drawRect方法主要是绘制轨迹和设置按钮状态

[Swift] 纯文本查看 复制代码
    // 绘制轨迹
    override func drawRect(rect: CGRect) {
        if self.buttons.count == 0 {
            return
        }
        let path = UIBezierPath()
        for i in 0 ..< self.buttons.count {
            let button = buttons[i]
            if i == 0 {
                path.moveToPoint(button.center)
            }else {
                path.addLineToPoint(button.center)
            }
        }
        path.addLineToPoint(movePoint)
        path.lineWidth = 8
        if result {
            UIColor.greenColor().set()
        }else {
            UIColor.redColor().set()
        }
        path.lineJoinStyle = .Round
        path.stroke()
    }


以上是主要代码,欢迎大家指出错误。




6、源代码免费下载

在这里下载代码,欢迎大家Star。

链接:(需要回复可见)

游客,如果您要查看本帖隐藏内容请回复


也可以在敏捷大拇指上直接购买下载:

仿网易邮箱大师手势解锁 Handle Lock(Swift版)免费下载源代码 HandleLockDemo-maste.zip (209.92 KB, 下载次数: 0, 售价: 10 金钱)

都看到这里了,就把这篇资料推荐给您的好朋友吧,让他们也感受一下。

回帖是一种美德,也是对楼主发帖的尊重和支持。

*声明:敏捷大拇指是全球最大的Swift开发者社区、苹果粉丝家园、智能移动门户,所载内容仅限于传递更多最新信息,并不意味赞同其观点或证实其描述;内容仅供参考,并非绝对正确的建议。本站不对上述信息的真实性、合法性、完整性做出保证;转载请注明来源并加上本站链接,敏捷大拇指将保留所有法律权益。如有疑问或建议,邮件至marketing@swifthumb.com

*联系:微信公众平台:“swifthumb” / 腾讯微博:@swifthumb / 新浪微博:@swifthumb / 官方QQ一群:343549891(满) / 官方QQ二群:245285613 ,需要报上用户名才会被同意进群,请先注册敏捷大拇指

嗯,不错!期待更多好内容,支持一把:
支持敏捷大拇指,用支付宝支付10.24元 支持敏捷大拇指,用微信支付10.24元

评分

参与人数 1金钱 +10 贡献 +10 专家分 +10 收起 理由
Anewczs + 10 + 10 + 10 32个赞!专家给力!

查看全部评分

本帖被以下淘专辑推荐:

swifter 发表于 2016-8-14 22:45:09 | 显示全部楼层
程序员需要设计师搭档啊
昏戏湿 发表于 2016-8-16 18:38:15 | 显示全部楼层
swifter 发表于 2016-8-14 22:45
程序员需要设计师搭档啊

都恨产品狗
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

做任务,领红包。
我要发帖

分享扩散

都看到这里了,就把这资料推荐给您的好朋友吧,让他们也感受一下。
您的每一位朋友访问此永久链接后,您都将获得相应的金钱积分奖励
关闭

站长推荐 上一条 /3 下一条

热门推荐

合作伙伴

Swift小苹果

  • 北京治世天下科技有限公司
  • ©2014-2016 敏捷大拇指
  • 京ICP备14029482号
  • Powered by Discuz! X3.1 Licensed
  • swifthumb Wechat Code
  •   
快速回复 返回顶部 返回列表