引言

  上一节中我们了解了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):小组件实现时钟按秒刷新的更多相关文章

  1. ios下,微信小程序scrollview组件中的fixed元素抖得和帕金森病人一样

    问题现象 这个问题是最近在优化小程序代码时发现的. 在ios环境下,微信小程序的scrollview组件包裹着一个position:fixed的view. 当在scrollview组件上滑动时,这个v ...

  2. 微信小程序自定义音频组件,自定义滚动条,单曲循环,循环播放

    小程序自定义音频组件,带滚动条 摘要:首先自定义音频组件,是因为产品有这样的需求,需要如下样式的 而微信小程序API给我们提供的就是这样的 而且产品需要小程序有后台播放功能,所以我们不考虑小程序的 a ...

  3. 第2章 微信小程序的基础组件学习

    小程序也可以用div+css进行排版. flex-direction排列方向,可以控制内部的成员的顺序,比如从左到右.从右到左.上下,纵向和横向. flex-wrap可以控制换行是如何去换行的,控制它 ...

  4. 支付宝小程序日期选择组件datePicker封装

    github 地址 https://github.com/iocool/antminDatePicker 最近在做支付宝小程序(以下简称小程序)开发,发现小程序的日期选择组件很不好用,比如安卓和IOS ...

  5. 原创:WeZRender:微信小程序Canvas增强组件

    WeZRender是一个微信小程序Canvas增强组件,基于HTML5 Canvas类库ZRender. 使用 WXML: <canvas style="width: 375px; h ...

  6. 微信小程序之swiper组件高度自适应

    微信小程序之swiper组件高度自适应 要求: (顶部广告栏 ) 改变swiper组件的固定高度,使之随内部每张图片的高度做自适应 原理: 图片加载完之后,获取图片的原始宽高,根据宽高比,计算出适应后 ...

  7. 详解封装微信小程序组件及小程序坑(附带解决方案)

    一.序 上一篇介绍了如何从零开发微信小程序,博客园审核变智障了,每次代码都不算篇幅,好好滴一篇原创,不到3分钟从首页移出来了.这篇介绍一下组件封装和我的踩坑历程. 二.封装微信小程序可复用组件 首先模 ...

  8. 微信小程序中的组件使用1

    不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...

  9. 小程序解决方案 Westore - 组件、纯组件、插件开发

    数据流转 先上一张图看清 Westore 怎么解决小程序数据难以管理和维护的问题: 非纯组件的话,可以直接省去 triggerEvent 的过程,直接修改 store.data 并且 update,形 ...

随机推荐

  1. BZOJ_2243 [SDOI2011]染色 【树链剖分+线段树】

    一 题目 [SDOI2011]染色 二 分析 感觉树链剖分的这些题真的蛮考验码力的,自己的码力还是不够啊!o(╯□╰)o 还是比较常规的树链剖分,但是一定记得这里的线段树在查询的时候一定要考虑链于链相 ...

  2. JS利用cookie记录当前位置实现刷新页面后还可以保持菜单栏的展开或闭合

    代码如下,重点是JS部分的代码(部分样式引用的是Bootstrapt中的):   <style> .sidebar-menu .special{ font-size: 16px; marg ...

  3. python之routes入门

    一.入门 from routes import Mapper map = Mapper() # 创建一个mapper()路由实例对象 # connect注册路由信息 # 路由名称'zbj', 路径是 ...

  4. Python模拟简易版淘宝客服机器人

    对于用Python制作一个简易版的淘宝客服机器人,大概思路是:首先从数据库中用sql语句获取相关数据信息并将其封装成函数,然后定义机器问答的主体函数,对于问题的识别可以利用正则表达式来进行分析,结合现 ...

  5. 【关系抽取-R-BERT】模型结构

    模型的整体结构 相关代码 import torch import torch.nn as nn from transformers import BertModel, BertPreTrainedMo ...

  6. Centos7安装以及设置Redis详细步骤

    一.Redis安装: 1.指定文件夹下下载redis安装包: [root@bogon ~]# mkdir /usr/local/soft/redis [root@bogon ~]# cd /usr/l ...

  7. NetCore的缓存使用详例

    关于我 作者博客|文章首发 缓存基础知识 缓存可以减少生成内容所需的工作,从而显著提高应用程序的性能和可伸缩性. 缓存最适用于不经常更改的 数据,生成 成本很高. 通过缓存,可以比从数据源返回的数据的 ...

  8. PAT (Advanced Level) Practice 1011 World Cup Betting (20 分) 凌宸1642

    PAT (Advanced Level) Practice 1011 World Cup Betting (20 分) 凌宸1642 题目描述: With the 2010 FIFA World Cu ...

  9. 快速了解 JavaScript ES2019 的五个新增特性

    ES2019 规范是对 JavaScript 的一个较小的补充,但它仍然带来了一些有用的功能.本文将向你展示五个 ES2019 新增的特性,这些特性或许可以让你的编程轻松一点.这些特性包括 trimS ...

  10. 如何调试 Java 开源项目源码,记一种源码导入开发工具并调试的通用方法

    楔子 说起读开源项目源码,很多朋友觉得高大上.大佬牛逼,云云~ 挡在很多人面前的不是源码怎么读,而是不知道如何导入源码到开发工具以及如何调试源码. 本文将以 spring-cloud-gateway ...