swift - 利用UIDatePicker实现定时器的效果
效果图如下:

可以通过UIDatePicker调整倒计时的时间,然后点击UIButton开始倒计时,使用NSTimer进行倒计时的时间展示,我是声明了一个label也进行了标记,
然后点击按钮开始倒计时的同时,弹出一个alertview,alertview上展示倒计时的一次递减的效果!结束后,改变下label、button、alertview的title的
显示字样!
具体代码如下:
1、声明所需各类控件
var datePicker = UIDatePicker()
var myBtn = UIButton()
var alertCon = UIAlertController()
var hTimers = Timer()
var labels = UILabel()
var leftTimes:Int =
2、创建datepicker,并绑定响应方法,可以进行倒计时时间的改变,默认初始是60s
func creatPicker(){
datePicker.frame = CGRect(x:,y:,width:kScreenWidth-,height:)
datePicker.backgroundColor = UIColor.yellow
datePicker.locale = Locale(identifier:"zh_CN")
datePicker.addTarget(self, action: #selector(valueChanged), for: .valueChanged)
datePicker.datePickerMode = .countDownTimer
datePicker.setValue(UIColor.red, forKey: "textColor")
self.view.addSubview(datePicker)
}
响应方法的实现:
//时间选择器的响应方法
func valueChanged() { print("选择倒计时间为-->:\(datePicker.countDownDuration)")
}
3、创建button,并绑定响应方法
func creatDatePicker(){
myBtn.frame = CGRect(x:,y:,width:kScreenWidth-,height:)
myBtn.setTitle("按钮", for: .normal)
myBtn.setTitle("倒计时中", for: .disabled)
myBtn.backgroundColor = UIColor.orange
myBtn.setTitleColor(UIColor.white, for: .normal)
myBtn.setTitleColor(UIColor.blue, for: .disabled)
myBtn.addTarget(self, action: #selector(btnClick), for: .touchUpInside)
self.view.addSubview(myBtn)
}
响应方法的实现,在按钮的响应方法里面绑定NSTimer的响应方法,在点击按钮的时候触发
unc btnClick(){
myBtn.isEnabled = false
// 获取该倒计时的剩余时间
leftTimes = Int(datePicker.countDownDuration)
datePicker.isEnabled = false
// 创建alertcontroller
alertCon = UIAlertController(title:"倒计时开始",message:"倒计时开始,还有\(leftTimes)",preferredStyle:.alert)
let cancel = UIAlertAction(title:"取消",style:.cancel,handler:nil)
let okAction = UIAlertAction(title:"确定",style:.default,handler:nil)
alertCon.addAction(cancel)
alertCon.addAction(okAction)
self.present(alertCon, animated: true, completion: nil)
// 启动定时器
hTimers = Timer.scheduledTimer(timeInterval: , target: self, selector: #selector(clickDown), userInfo: nil, repeats: true)
}
4、实现倒计时的响应方法
func clickDown(){
labels.text = "倒计时开始,还有\(leftTimes)s"
alertCon.message = "倒计时开始,还有\(leftTimes)s"
// 剩余时间少一秒
leftTimes -=
datePicker.countDownDuration = TimeInterval(leftTimes)
if leftTimes <= {
// 取消定时器
hTimers.invalidate()
// 改变UIDatePicker和UiButton,还有UILabel的状态
datePicker.isEnabled = true
myBtn.isEnabled = true
labels.text = "倒计时结束"
alertCon.message = "时间到!"
}
}
这样就完成了!
swift - 利用UIDatePicker实现定时器的效果的更多相关文章
- 利用div实现遮罩层效果
利用div实现遮罩层效果就是利用一个全屏.半透明的div遮住页面上其它元素,典型的例子就是百度的登录界面.下面贴出示例代码: <!DOCTYPE html> <html> &l ...
- 利用MARQUEE实现正在处理效果
ASP.NET服务器端事件利用MARQUEE实现正在处理效果 前言:ASP.NET同仁们应该都遇到过当触发一个比较耗时的服务器端事件时,页面会处在一个等待的状态(即假死状态),用户体验非常不好,很 ...
- Swift - 用CATransform3DMakeRotation实现翻页效果
Swift - 用CATransform3DMakeRotation实现翻页效果 效果 源码 https://github.com/YouXianMing/Swift-Animations // // ...
- Swift - 多个mask的动画效果
Swift - 多个mask的动画效果 效果 源码 https://github.com/YouXianMing/Swift-Animations // // TranformFadeView.swi ...
- Swift - 用UIScrollView实现视差动画效果
Swift - 用UIScrollView实现视差动画效果 效果 源码 https://github.com/YouXianMing/Swift-Animations // // MoreInfoVi ...
- Android利用温度传感器实现带动画效果的电子温度计
概述 Android利用温度传感器实现带动画效果的电子温度计. 详细 代码下载:http://www.demodashi.com/demo/10631.html 一.准备工作 需要准备一部带有温度传感 ...
- 我的Android进阶之旅------>Android利用温度传感器实现带动画效果的电子温度计
要想实现带动画效果的电子温度计,需要以下几个知识点: 1.温度传感器相关知识. 2.ScaleAnimation动画相关知识,来进行水印刻度的缩放效果. 3.android:layout_weight ...
- 利用GPU实现翻页效果(分享自知乎网)
https://zhuanlan.zhihu.com/p/28836892?utm_source=qq&utm_medium=social 首发于Runtime 写文章 利用GPU实现翻页效果 ...
- 不借助 Javascript,利用 SVG 快速构建马赛克效果
之前在公众号转发了好友 Vajoy 的一篇文章 -- 巧用 CSS 把图片马赛克风格化. 核心是利用了 CSS 中一个很有意思的属性 -- image-rendering,它可以用于设置图像缩放算法. ...
随机推荐
- 微信支付V3版本的那些事
最近在接入微信支付这块功能,博客园也有很多博友发表了支付的各种吐槽和解决之道,基于那些经验分享之上,我也来说说我的填坑之路. 1:准备工作,首先去申请注册一个公众号——服务号,然后将微信支付功能开通, ...
- 【Java】Callable,Runnable比较及用法
1.Runnable和Callable的区别 (1) Callable规定的方法是 call(), Runnable规定的方法是 run(). (2) Callable的任务执行后可返回值,而 Run ...
- UML笔记1
UML包括 事物 结构:类,接口等等 行为:交互,状态改变等 分组:包,子系统等 注释 关系 依赖,关联(聚合,组合),泛化,实现 图 用例图,交互图(顺序图,协作图),类图,活动图,状态图等 扩展机 ...
- tomcat Can't create cache file!
) at javax.imageio.ImageIO.write(ImageIO.java:1558) ... 119 more Caused by: java.io.IOException: 系统找 ...
- redis使用redis-cli查看所有的keys及清空所有的数据
redis_home:redis安装路径: cd %redis_home%/src ./redis-cli -h 127.0.0.1 127.0.0.1:6379> keys * (em ...
- 一款手机端的jQuery图片滑块插件
今天我们要介绍一款比较特别的jQuery图片滑块插件,它不仅在PC浏览器上可以使用,而且更适合在手机端的网页中使用.这款jQuery插件不仅可以定义图片切换的方向,而且可以即时切换图片切换的动画方式, ...
- JDBC的介绍2
一.基础知识 1. 数据持久化 持久化(persistence):对象在内存中创建后,不能永久存在.把对象永久的保存起来就是持久化的过程.而持久化的实现过程大多通过各种关系数据库来完成. 持久化的主要 ...
- 数据库——SQL中EXISTS怎么用1(转)
EXISTS用于检查子查询是否至少会返回一行数据,该子查询实际上并不返回任何数据,而是返回值True或False 方法/步骤 EXISTS用于检查子查询是否至少会返回一行数据,该子查询实际上并不返 ...
- ORACLE11G 字符集更改(这里更改为AL32UTF8)
ORACLE11G 字符集更改(这里更改为AL32UTF8)更改步骤:1.用sysdba角色用户登录sqlplus: 命令行输入:sqlplus sys as sysdba 2.输入口令,进入sqlp ...
- larave框架的安装
(1)中文官网:http://www.golaravel.com/ (2)composer下载与安装 1:composer网址:getcomposer.org 2:windows下载Composer- ...