1# 简单时钟 2 3### 介绍 4 5本示例通过使用[@ohos.display](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-display.md) 接口以及Canvas组件来实现一个简单的时钟应用。 6 7### 效果预览 8 9|主页| 10|--------------------------------| 11|| 12 13使用说明 14 151.界面通过setInterval实现周期性实时刷新时间，使用Canvas绘制时钟，指针旋转角度通过计算得出。 16 17例如："2 * Math.PI / 60 * second"是秒针旋转的角度。 18 19### 工程目录 20``` 21entry/src/main/ets/ 22|---Application 23|---MainAbility 24|---model 25| |---Logger.ts // 日志工具 26|---pages 27| |---Index.ets // 首页 28 29``` 30### 具体实现 31 32* 本示例展示简单时钟的方法主要封装在Index中，源码参考:[Index.ets](entry/src/main/ets/pages/Index.ets) 。 33 * 设置表盘大小：通过Index中的display.getDefaultDisplay()方法来获取设备宽高计算表盘大小； 34 * 获取当前时间：调用updateTime函数，执行new Date().getHours()、new Date().getMinutes()、new Date().getSeconds()获取当前时间。 35 * 绘制表盘内容：通过[CanvasRenderingContext2D](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-canvasrenderingcontext2d.md) 来画表盘背景、时针、分针、秒针、圆心以及表盘下方文本； 36 * 启动时钟：添加setInterval定时器，每隔1s执行一次updateTime函数。 37 38### 相关权限 39 40不涉及。 41 42### 依赖 43 44不涉及。 45 46### 约束与限制 47 481.本示例仅支持标准系统上运行。 49 502.本示例已适配API14版本SDK，SDK版本号(API Version 14 Release),镜像版本号(5.0.2 Release)。 51 523.本示例需要使用DevEco Studio 版本号(5.0.2 Release)及以上版本才可编译运行。 53 54### 下载 55 56如需单独下载本工程，执行如下命令： 57``` 58git init 59git config core.sparsecheckout true 60echo code/Solutions/Tools/ArkTSClock/ > .git/info/sparse-checkout 61git remote add origin https://gitee.com/openharmony/applications_app_samples.git 62git pull origin master 63 64```
