热门标签 | HotTags
当前位置:  开发笔记 > IOS > 正文

iOS滑动解锁、滑动获取验证码效果的实现代码

这篇文章主要介绍了iOS滑动解锁、滑动获取验证码效果的实现代码,小编认为还不错,非常实用,所有分享给大家,感兴趣的朋友可以参考下

 最近短信服务商要求公司的app在获取短信验证码时加上校验码,目前比较流行的是采用类似滑动解锁的方式,我们公司采取的就是这种方式,设计图如下所示:

这里写图片描述

这里校验内部的处理逻辑不作介绍,主要分享一下界面效果的实现, 下面贴出代码:

先子类化UISlider

#import 
#define SliderWidth 240
#define SliderHeight 40
#define SliderLabelTextColor [UIColor colorWithRed:193/255.0 green:193/255.0 blue:193/255.0 alpha:1]
#define SliderLabelBorderColor [UIColor colorWithRed:193/255.0 green:193/255.0 blue:193/255.0 alpha:1].CGColor
#define SliderMinimumTrackTintColor [UIColor redColor]
#define SliderLabelFont 14
#define SliderLabelText @"滑动解锁/获取验证码"
#define ThumbImageWidth 40
#define ThumbImageHeight 40
@interface CheckCodeSlider : UISlider
@end
//*******************************************************
#import "CheckCodeSlider.h"
@implementation CheckCodeSlider
//覆写父类UISlider的方法改变滑条frame
- (CGRect)trackRectForBounds:(CGRect)bounds{
return CGRectMake(0, 0, SliderWidth, SliderHeight);
}
@end

再实例化CheckCodeSlider,这里随便在一个ViewController里写的

#import "ViewController.h"
#import "CheckCodeSlider.h"
@interface ViewController (){
UIImageView *imgView;
}
@property (nonatomic ,strong)CheckCodeSlider *slider;
@property (nonatomic ,strong)UILabel *label;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];
[self createSlider];
}
- (void)createSlider{
_slider = [[CheckCodeSlider alloc]initWithFrame:CGRectMake(0, 0, SliderWidth, SliderHeight)];
_slider.center = self.view.center;
_slider.minimumTrackTintColor = [UIColor clearColor];
_slider.maximumTrackTintColor = [UIColor clearColor];
_slider.layer.masksToBounds = YES;
_slider.layer.cornerRadius = SliderHeight/2;
[_slider setThumbImage:[UIImage imageNamed:@"滑块按钮"] forState:UIControlStateNormal];
[_slider addTarget:self action:@selector(sliderValueChanged:) forControlEvents:UIControlEventValueChanged];
[self.view addSubview:_slider];
_label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, SliderWidth, SliderHeight)];
_label.center = self.view.center;
_label.text = SliderLabelText;
_label.fOnt= [UIFont systemFontOfSize:SliderLabelFont];
_label.textAlignment = NSTextAlignmentCenter;
_label.textColor = SliderLabelTextColor;
_label.layer.masksToBounds = YES;
_label.layer.cornerRadius = SliderHeight/2;
_label.layer.borderWidth = 1;
_label.layer.borderColor = SliderLabelBorderColor;
[self.view addSubview:_label];
//这里创建了一个跟滑块相同的imageview覆盖在文字上面,并在sliderValueChanged方法中让其跟着滑块滑动。
imgView = [[UIImageView alloc]initWithFrame:CGRectMake(_slider.frame.origin.x-2, _slider.frame.origin.y-2, ThumbImageWidth+4, ThumbImageHeight+4)];
imgView.image = [UIImage imageNamed:@"滑块按钮"];
[self.view addSubview:imgView];
}
- (void)sliderValueChanged:(UISlider *)slider{
[_slider setValue:slider.value animated:NO];
if (slider.value >0) {
_slider.minimumTrackTintColor = SliderMinimumTrackTintColor;
}else{
_slider.minimumTrackTintColor = [UIColor clearColor];
}
imgView.center = CGPointMake(_slider.frame.origin.x+slider.value*(SliderWidth-ThumbImageWidth)+ThumbImageWidth/2, _slider.frame.origin.y+ThumbImageHeight/2);
if (!slider.isTracking && slider.value != 1) {
[_slider setValue:0 animated:YES];
if (slider.value >0) {
_slider.minimumTrackTintColor = SliderMinimumTrackTintColor;
}else{
_slider.minimumTrackTintColor = [UIColor clearColor];
}
imgView.frame = CGRectMake(_slider.frame.origin.x-2, _slider.frame.origin.y-2, ThumbImageWidth+4, ThumbImageHeight+4);
}
}

这样就可以实现上图中的效果,只需要在sliderValueChanged根据slider的value值做相应处理就行了。

以上所述是小编给大家介绍的iOS滑动解锁、滑动获取验证码效果的实现代码,希望对大家有所帮助!


推荐阅读
  • 本文总结了2018年的关键成就,包括职业变动、购车、考取驾照等重要事件,并分享了读书、工作、家庭和朋友方面的感悟。同时,展望2019年,制定了健康、软实力提升和技术学习的具体目标。 ... [详细]
  • 在计算机技术的学习道路上,51CTO学院以其专业性和专注度给我留下了深刻印象。从2012年接触计算机到2014年开始系统学习网络技术和安全领域,51CTO学院始终是我信赖的学习平台。 ... [详细]
  • 本文介绍如何在 Xcode 中使用快捷键和菜单命令对多行代码进行缩进,包括右缩进和左缩进的具体操作方法。 ... [详细]
  • 如何在PHPcms网站中添加广告
    本文详细介绍了在PHPcms网站后台添加广告的方法,涵盖多种常见的广告形式,如百度广告和Google广告,并提供了相关设置的步骤。同时,文章还探讨了优化网站流量的SEO策略。 ... [详细]
  • 当iOS设备越狱后,某些插件可能会导致系统崩溃(白苹果)。此时,可以通过进入安全模式来排查并删除有问题的插件。本文将详细介绍如何通过特定按键组合进入不加载MobileSubstrate的安全模式,并提供相关背景知识。 ... [详细]
  • 在Linux系统中配置并启动ActiveMQ
    本文详细介绍了如何在Linux环境中安装和配置ActiveMQ,包括端口开放及防火墙设置。通过本文,您可以掌握完整的ActiveMQ部署流程,确保其在网络环境中正常运行。 ... [详细]
  • C++: 实现基于类的四面体体积计算
    本文介绍如何使用C++编程语言,通过定义类和方法来计算由四个三维坐标点构成的四面体体积。文中详细解释了四面体体积的数学公式,并提供了两种不同的实现方式。 ... [详细]
  • 本文介绍如何通过Windows批处理脚本定期检查并重启Java应用程序,确保其持续稳定运行。脚本每30分钟检查一次,并在需要时重启Java程序。同时,它会将任务结果发送到Redis。 ... [详细]
  • 如何优化2060显卡设置以提升《Apex英雄》游戏体验
    《Apex英雄》作为一款热门的战术竞技游戏,吸引了大量玩家。本文将探讨如何通过优化GeForce RTX 2060显卡设置,确保在《Apex英雄》中获得最佳性能和流畅的游戏体验。 ... [详细]
  • 本章将深入探讨移动 UI 设计的核心原则,帮助开发者构建简洁、高效且用户友好的界面。通过学习设计规则和用户体验优化技巧,您将能够创建出既美观又实用的移动应用。 ... [详细]
  • 本文介绍如何通过SQL查询从JDE(JD Edwards)系统中提取所有字典数据,涵盖关键表的关联和字段选择。具体包括F0004和F0005系列表的数据提取方法。 ... [详细]
  • 如何高效创建和使用字体图标
    在Web和移动开发中,为什么选择字体图标?主要原因是其卓越的性能,可以显著减少HTTP请求并优化页面加载速度。本文详细介绍了从设计到应用的字体图标制作流程,并提供了专业建议。 ... [详细]
  • 本文详细介绍了如何通过命令行启动MySQL服务,包括打开命令提示符窗口、进入MySQL的bin目录、输入正确的连接命令以及注意事项。文中还提供了更多相关命令的资源链接。 ... [详细]
  • 扫描线三巨头 hdu1928hdu 1255  hdu 1542 [POJ 1151]
    学习链接:http:blog.csdn.netlwt36articledetails48908031学习扫描线主要学习的是一种扫描的思想,后期可以求解很 ... [详细]
  • 本文将详细介绍在Windows 7环境下,检查U盘启动盘是否制作成功的多种方法,包括通过BIOS设置和使用模拟启动工具。 ... [详细]
author-avatar
mobiledu2502880747
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有