返回 导航

Swift

hangge.com

Swift - 使用UIDatePicker实现倒计时功能

作者:hangge | 2015-01-20 09:31
(本文代码已升级至Swift4)

如果使用UIDatePicker时将模式设置为CountDownTimer,即可让该控件作为倒计时器来使用。效果图如下:
  

下面是代码示例:
import UIKit

class ViewController: UIViewController {
    
    var  ctimer:UIDatePicker!
    var btnstart:UIButton!
    
    var leftTime:Int = 180
    var alertController:UIAlertController!
    
    var timer:Timer!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        ctimer = UIDatePicker(frame:CGRect(x:0, y:120, width:200, height:200))
        self.ctimer.datePickerMode = UIDatePickerMode.countDownTimer
        
        //必须为 60 的整数倍,比如设置为100,值自动变为 60
        self.ctimer.countDownDuration = TimeInterval(leftTime);
        ctimer.addTarget(self, action: #selector(ViewController.timerChanged),
                         for: .valueChanged)
        
        self.view.addSubview(ctimer)
        
        btnstart =  UIButton(type: .system)
        btnstart.frame = CGRect(x:100, y:400, width:100, height:100);
        btnstart.setTitleColor(UIColor.red, for: .normal)
        btnstart.setTitleColor(UIColor.green, for:.disabled)
        btnstart.setTitle("开始", for:.normal)
        btnstart.setTitle("倒计时中", for:.disabled)
        
        btnstart.clipsToBounds = true
        btnstart.layer.cornerRadius = 5
        btnstart.addTarget(self, action:#selector(ViewController.startClicked),
                           for:.touchUpInside)
        
        self.view.addSubview(btnstart)
    }
    
    @objc func timerChanged()
    {
        print("您选择倒计时间为:\(self.ctimer.countDownDuration)")
    }
    
    /**
     *开始倒计时按钮点击
     */
    @objc func startClicked(sender:UIButton)
    {
        self.btnstart.isEnabled = false
        
        // 获取该倒计时器的剩余时间
        leftTime = Int(self.ctimer.countDownDuration);
        // 禁用UIDatePicker控件和按钮
        self.ctimer.isEnabled = false
        
        // 创建一个UIAlertController对象(警告框),并确认,倒计时开始
        alertController = UIAlertController(title: "系统提示",
                                            message: "倒计时开始,还有 \(leftTime) 秒...",
                                            preferredStyle: .alert)
        let cancelAction = UIAlertAction(title: "确定", style: .cancel, handler: nil)
        alertController.addAction(cancelAction)
        // 显示UIAlertController组件
        self.present(alertController, animated: true, completion: nil)
        
        // 启用计时器,控制每秒执行一次tickDown方法
        timer = Timer.scheduledTimer(timeInterval: TimeInterval(1), target:self,
                                     selector:#selector(ViewController.tickDown),
                                     userInfo:nil,repeats:true)
    }
    
    /**
     *计时器每秒触发事件
     **/
    @objc func tickDown()
    {
        alertController.message = "倒计时开始,还有 \(leftTime) 秒..."
        // 将剩余时间减少1秒
        leftTime -= 1;
        // 修改UIDatePicker的剩余时间
        self.ctimer.countDownDuration = TimeInterval(leftTime);
        print(leftTime)
        // 如果剩余时间小于等于0
        if(leftTime <= 0)
        {
            // 取消定时器
            timer.invalidate();
            // 启用UIDatePicker控件和按钮
            self.ctimer.isEnabled = true;
            self.btnstart.isEnabled = true;
            alertController.message = "时间到!"
        }
    }
}

上面的代码其实还是有个小bug的。
(1)问题描述:代码中给时间控件添加了个 ValueChanged 事件监听响应,目的是想每次选择的时间改变时都会触发打印出时间。但运行会发现,第一次拨动表盘不触发,后面再改变值才会触发。
(2)解决办法:这个是iOS的bug,我们把设置初始时间代码
//必须为 60 的整数倍,比如设置为100,值自动变为 60
self.ctimer.countDownDuration = TimeInterval(leftTime)
修改成
DispatchQueue.main.async{
    self.ctimer.countDownDuration = TimeInterval(self.leftTime)
}
(如果我们不需要关心值改变事件的话,直接用原来的赋值方法即可。)
评论

全部评论(3)

回到顶部