142. SAP UI5 的 TimePicker ，一个钟表外观的时间选择控件

本文介绍 SAP UI5 提供的一个具有钟表外观的时间选择控件的使用和实现方法。

本文基于的 SAP UI5 版本为：1.106.0

先看看按照本步骤实现后得到的效果。

进入文件夹 142，执行命令行 ui5 serve, 然后打开 url http://localhost:8080/index.html，看到如下界面：

这个区域分为三个区域。单击区域 2 包含的任意六个 TimePicker 其中的一个，都能打开一个钟表外观的时间选择控件，如下图所示：

可以看到这些钟表外观有细微的差异。TimePicker 控件的时间选择，样式控制以及事件响应处理逻辑，在本文余下部分详细叙述。

本步骤这个测试页面分为 3 个区域，区域 1 的 mask