IOS小组件(6):小组件实现时钟按秒刷新
引言
上一节中我们了解了IOS小组件的刷新机制,发现根本没法实现按秒刷新,但是看别的App里面有做到,以为用了什么黑科技,原来是因为系统提供了一个额外的机制实现时间的动态更新,不用走小组件的刷新机制。
Text控件支持显示日期时间,下面是来自官网的代码
计算时间差
let components = DateComponents(minute: 11, second: 14)
let futureDate = Calendar.current.date(byAdding: components, to: Date())!
Text(futureDate, style: .relative)
// Displays:
// 11 min, 14 sec
Text(futureDate, style: .offset)
// Displays:
// -11 minutes
使用relative样式可以显示当前日期和时间与指定日期之间的差值(绝对值),而不管该日期是将来的还是过去的日期。使用offset样式显示当前日期和时间与指定日期之间的时差,表示将来的日期带有减号(-)前缀,而过去的日期带有加号(+)前缀。
倒计时和计时器
let components = DateComponents(minute: 15)
let futureDate = Calendar.current.date(byAdding: components, to: Date())!
Text(futureDate, style: .timer)
// Displays:
// 15:00
对于将来的日期,timer样式将递减计数(倒计时),直到当前时间达到指定的日期和时间为止,并在日期经过时递增计数(计时器)。
显示绝对日期或时间
// Absolute Date or Time
let components = DateComponents(year: 2020, month: 4, day: 1, hour: 9, minute: 41)
let aprilFirstDate = Calendar.current(components)!
Text(aprilFirstDate, style: .date)
Text("Date: \(aprilFirstDate, style: .date)")
Text("Time: \(aprilFirstDate, style: .time)")
// Displays:
// April 1, 2020
// Date: April 1, 2020
// Time: 9:41AM
显示两个日期之间的时间间隔
let startComponents = DateComponents(hour: 9, minute: 30)
let startDate = Calendar.current.date(from: startComponents)!
let endComponents = DateComponents(hour: 14, minute: 45)
let endDate = Calendar.current.date(from: endComponents)!
Text(startDate ... endDate)
Text("The meeting will take place: \(startDate ... endDate)")
// Displays:
// 9:30AM-2:45PM
// The meeting will take place: 9:30AM-2:45PM
实现一天时间的计时器
使用 style: .time样式,如果当前的时间比指定的时间大,则时间就会累计。基于这个原理,我们只需要把时间起点定在每天的0点即可,根据当前的时间计算出今天的开始时间。以下方法可以根据12,24小时制度,获取当天起点时间。
//获取当天开始的日期,给Date增加一个拓展方法
extension Date {
func getCurrentDayStart(_ isDayOf24Hours: Bool)-> Date {
let calendar:Calendar = Calendar.current;
let year = calendar.component(.year, from: self);
let month = calendar.component(.month, from: self);
let day = calendar.component(.day, from: self);
let components = DateComponents(year: year, month: month, day: day, hour: 0, minute: 0, second: 0)
return Calendar.current.date(from: components)!
}
}
// 实现一天内的计时器
Text(Date().getCurrentDayStart(true), style: .timer)
结语
通过IOS Text控件我们实现了按秒刷新的计时器,所以数字时钟的按秒刷新算是解决了,但是怎么实现表盘时钟的秒针360度旋转呢?如果让秒针精确的对应当前的时间,应该做不到了。后面再继续研究,如果有解决方案的可以贡献一下,感谢。
IOS小组件(6):小组件实现时钟按秒刷新的更多相关文章
- ios下,微信小程序scrollview组件中的fixed元素抖得和帕金森病人一样
问题现象 这个问题是最近在优化小程序代码时发现的. 在ios环境下,微信小程序的scrollview组件包裹着一个position:fixed的view. 当在scrollview组件上滑动时,这个v ...
- 微信小程序自定义音频组件,自定义滚动条,单曲循环,循环播放
小程序自定义音频组件,带滚动条 摘要:首先自定义音频组件,是因为产品有这样的需求,需要如下样式的 而微信小程序API给我们提供的就是这样的 而且产品需要小程序有后台播放功能,所以我们不考虑小程序的 a ...
- 第2章 微信小程序的基础组件学习
小程序也可以用div+css进行排版. flex-direction排列方向,可以控制内部的成员的顺序,比如从左到右.从右到左.上下,纵向和横向. flex-wrap可以控制换行是如何去换行的,控制它 ...
- 支付宝小程序日期选择组件datePicker封装
github 地址 https://github.com/iocool/antminDatePicker 最近在做支付宝小程序(以下简称小程序)开发,发现小程序的日期选择组件很不好用,比如安卓和IOS ...
- 原创:WeZRender:微信小程序Canvas增强组件
WeZRender是一个微信小程序Canvas增强组件,基于HTML5 Canvas类库ZRender. 使用 WXML: <canvas style="width: 375px; h ...
- 微信小程序之swiper组件高度自适应
微信小程序之swiper组件高度自适应 要求: (顶部广告栏 ) 改变swiper组件的固定高度,使之随内部每张图片的高度做自适应 原理: 图片加载完之后,获取图片的原始宽高,根据宽高比,计算出适应后 ...
- 详解封装微信小程序组件及小程序坑(附带解决方案)
一.序 上一篇介绍了如何从零开发微信小程序,博客园审核变智障了,每次代码都不算篇幅,好好滴一篇原创,不到3分钟从首页移出来了.这篇介绍一下组件封装和我的踩坑历程. 二.封装微信小程序可复用组件 首先模 ...
- 微信小程序中的组件使用1
不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...
- 小程序解决方案 Westore - 组件、纯组件、插件开发
数据流转 先上一张图看清 Westore 怎么解决小程序数据难以管理和维护的问题: 非纯组件的话,可以直接省去 triggerEvent 的过程,直接修改 store.data 并且 update,形 ...
随机推荐
- Go语言学习笔记——在本地建立一个官网查看
命令行内运行 godoc -http=:8080 运行完成后打开浏览器输入网址:http://localhost:8080能看到一个和官网一模一样的网站,然后查看帮助文档
- Prometheus时序数据库-数据的查询
Prometheus时序数据库-数据的查询 前言 在之前的博客里,笔者详细阐述了Prometheus数据的插入过程.但我们最常见的打交道的是数据的查询.Prometheus提供了强大的Promql来满 ...
- JVM之对象回收
finalize /** *此代码演示了两点: *1.对象可以在被GC时自我拯救. *2.这种自救的机会只有一次,因为一个对象的finalize()方法最多只会被系统自动调用一次 */ public ...
- P1028_数的计算(JAVA语言)
题目描述 我们要求找出具有下列性质数的个数(包含输入的自然数n): 先输入一个自然数n(0n≤1000),然后对此自然数按照如下方法进行处理: 不作任何处理; 在它的左边加上一个自然数,但该自然数不能 ...
- DEV表格设置列不可编辑
现在是可编辑的 Run Designer--Columns--Column options下的AllowEdit属性改为false即可
- vue 给一个值重置初始值
查了下资料很多都是如下: 1. this.$options.data() 这个可以获取原始的data值,this.$data 获取当前状态下的data,拷贝重新赋值一下就行了. 1 Object.as ...
- linux程序开机自动启动
linux如果需要实现开机启动, 可以找到 $HOME/.config/autostart 目录(没有的话新建一个),在该文件夹下创建一个空文件,文件名自拟,后缀必须是desktop,如:dingda ...
- 从I/O多路复用到Netty,还要跨过Java NIO包
本文是Netty系列第4篇 上一篇文章我们深入了解了I/O多路复用的三种实现形式,select/poll/epoll. 那Netty是使用哪种实现的I/O多路复用呢?这个问题,得从Java NIO包说 ...
- docker部署kafka集群
利用docker可以很方便的在一台机子上搭建kafka集群并进行测试.为了简化配置流程,采用docker-compose进行进行搭建. kafka搭建过程如下: 编写docker-compose.ym ...
- Database | 浅谈Query Optimization (1)
综述 由于SQL是声明式语言(declarative),用户只告诉了DBMS想要获取什么,但没有指出如何计算.因此,DBMS需要将SQL语句转换成可执行的查询计划(Query Plan).但是对同样的 ...