美文网首页iOS文章iOSiOS技巧学习_JM
iOS 短信验证码倒计时按钮的实现

iOS 短信验证码倒计时按钮的实现

作者: Li_Cheng | 来源:发表于2016-05-03 11:27 被阅读9135次

个人博客: LiCheng的博客

引言:

验证码倒计时按钮的应用是非常普遍的,本文介绍了IOS实现验证码倒计时功能,点击获取验证码,进入时间倒计时,感兴趣的小伙伴们可以参考一下:

效果图

实现思路:

  • 创建按钮, 添加点击方法;
  • 用NSTimer定时器, 每秒执行一次, 定时改变Button的title,改变Button的样式, 设置Button不可点击;
  • 若倒计时结束, 定时器关闭, 并改变Button的样式, 可以点击;

代码如下:

在按钮的点击事件里调用该方法.

// 开启倒计时效果
-(void)openCountdown{

    __block NSInteger time = 59; //倒计时时间
    
    dispatch_queue_t queue = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0);
    dispatch_source_t _timer = dispatch_source_create(DISPATCH_SOURCE_TYPE_TIMER, 0, 0, queue);
    
    dispatch_source_set_timer(_timer,dispatch_walltime(NULL, 0),1.0*NSEC_PER_SEC, 0); //每秒执行
    
    dispatch_source_set_event_handler(_timer, ^{
        
        if(time <= 0){ //倒计时结束,关闭
            
            dispatch_source_cancel(_timer);
            dispatch_async(dispatch_get_main_queue(), ^{

                //设置按钮的样式
                [self.authCodeBtn setTitle:@"重新发送" forState:UIControlStateNormal];
                [self.authCodeBtn setTitleColor:[UIColor colorFromHexCode:@"FB8557"] forState:UIControlStateNormal];
                self.authCodeBtn.userInteractionEnabled = YES;
            });

        }else{
            
            int seconds = time % 60;
            dispatch_async(dispatch_get_main_queue(), ^{

                //设置按钮显示读秒效果
                [self.authCodeBtn setTitle:[NSString stringWithFormat:@"重新发送(%.2d)", seconds] forState:UIControlStateNormal];
                [self.authCodeBtn setTitleColor:[UIColor colorFromHexCode:@"979797"] forState:UIControlStateNormal];
                self.authCodeBtn.userInteractionEnabled = NO;
            });
            time--;
        }
    });
    dispatch_resume(_timer);
}

注意点:

我们在创建Button时, 要设置Button的样式:
当type为: UIButtonTypeCustom时 , 是读秒的效果.
当type为: 其他时, 是一闪一闪的效果.
<br />

相关文章

网友评论

  • 多LV信源:问下, app进入后台后, 倒计时停止了, 怎么解决?
  • 有理想有暴富的小青年:@property(nonatomic,strong)dispatch_source_t timer;
    把timer写成strong的属性 完美解决。。。
    多LV信源:完美解决什么?
  • 酒红色T恤:我是把一个Button写了一个分类,但是有个问题:点击Home键进入后台,定时器不走了,楼主看下怎么解?
    多LV信源:我也遇到了相同的问题
  • 尼古拉斯骄傲:这种多线程的倒计时会比NSTimer好么
  • dongfang:处理完毕后这个 线程还需要关闭吗?
    有没有demo
  • AbnerZhang:作者你好, 请问在实际应用中, 是调用发送验证码接口成功以后倒计时还是点击按钮的就开始倒计时?
    llq_31da:有没有办法,点击按钮就开始倒计时,如果请求失败,就停止倒计时???
    Li_Cheng:@AbnerZhang 我正常情况是请求成功的才开始倒计时,不然如果请求失败,你这边就开始倒计时了,但是并没有发送验证码
  • MrCola:我在ViewController2中创建的定时器,定时器开始后,pop到ViewController1,再重新进入ViewController2中,定时器的倒计时还在走,但是button的setTitle方法失效了,请问有什么好的解决办法?
  • yumiao:解决App进入后台倒计时暂停的问题(http://www.jianshu.com/p/dfd84204c670)
  • yumiao:不错,但是App进入后台,倒计时就停止了
    多LV信源:为什么倒计时停止了?
  • Simon_____:我们在创建Button时, 要设置Button的样式:
    当type为: UIButtonTypeCustom时 , 是读秒的效果.
    当type为: 其他时, 是一闪一闪的效果.
    大神解释下呗
  • brownfeng:倒计时按钮 dispatch_timer 实现挺好的
  • 迟明子:给大家一个十六进制数转UIColor的 简短的方法
    #define kColorFromRGBHexi(rgbValue) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:1.0],
    大家用的时候直接这样kColorFromRGBHexi(XXXX) 就好了.
    篁小韵:试了下,好像不能用含有字母的,只能用000000黑色这样的。
  • 左叶右玉:如果在倒计时的时候,点击返回,控制器不会被销毁吧?之后等到倒计时完成后才销毁吧。
    左叶右玉:@左叶右玉 手动销毁控制器是不对的,应该手动销毁这个倒计时的线程dispatch_source_t。全局_timer 返回的时候调用dispatch_source_cancel(_timer);
    左叶右玉:@Li_Cheng 测试了一下,这个倒计时不销毁的情况下,你在里面引用的self.authCodeBtn就不会销毁,这个self就是控制器本身了。强制销毁只会报错。
    Li_Cheng:@左叶右玉 可以在返回事件中手动销毁控制器
  • 小北风sky:感谢分享
  • Alan_yo:當歸零時怎麼從頭點擊又可以重新計時?
    koreadragon:结束后把倒计时时间重新赋值给变量
  • LennonLin:感谢分享....做出来对了..可是不太理解原理....就是多线程的东西有点懵逼
  • KKw16:好用
  • 03a65f7ecd8c:刚开始点击的时候是显示00s 然后过一秒后才开始60s、59s、58s....的倒数,这是为什么呢? :flushed:
    Triumphant:@Li_Cheng stringFromHexCode这个颜色类方法分享一下呗
    Li_Cheng:@呆萌的饭团 我这里写的就是59秒 , 应该是你自己写成60了吧
    03a65f7ecd8c: __block NSInteger time = 60;改成__block NSInteger time = 59;

本文标题:iOS 短信验证码倒计时按钮的实现

本文链接:https://www.haomeiwen.com/subject/jsnlrttx.html