1# TextTimer 2 3通过文本显示计时信息并控制其计时器状态的组件。 4 5> **说明：** 6> 7> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 8 9## 子组件 10 11无 12 13## 接口 14 15TextTimer(options?: { isCountDown?: boolean, count?: number, controller?: TextTimerController }) 16 17**参数：** 18 19| 参数名 | 参数类型 | 必填 | 参数描述 | 20| ----------- | -------- | -------- | -------- | 21| isCountDown | boolean | 否 | 是否倒计时。<br/>默认值：false | 22| count | number | 否 | 倒计时时间（isCountDown为true时生效），单位为毫秒。最长不超过86400000毫秒（24小时）。 0<count<86400000时，count值为倒计时初始值。否则，使用默认值为倒计时初始值。<br/>默认值：60000 | 23| controller | [TextTimerController](#texttimercontroller) | 否 | TextTimer控制器。 | 24 25## 属性 26 27| 名称 | 参数类型 | 描述 | 28| -------- | ---------------------- | ---------------------- | 29| format | string | 自定义格式，需至少包含一个HH、mm、ss、SS中的关键字。如使用yy、MM、dd等日期格式，则使用默认值。<br/>默认值：'HH:mm:ss.SS' | 30 31## 事件 32 33| 名称 | 功能描述 | 34| ---------------------------------------- | ---------------------------------------- | 35| onTimer(event: (utc: number, elapsedTime: number) => void) | 时间文本发生变化时触发。<br/>utc：Linux时间戳，即自1970年1月1日起经过的毫秒数。<br/>elapsedTime：计时器经过的时间，单位为毫秒。 | 36 37## TextTimerController 38 39TextTimer组件的控制器，用于控制文本计时器。一个TextTimer组件仅支持绑定一个控制器。 40 41### 导入对象 42 43``` 44textTimerController: TextTimerController = new TextTimerController() 45 46``` 47 48### start 49 50start() 51 52计时开始。 53 54### pause 55 56pause() 57 58计时暂停。 59 60### reset 61 62reset() 63 64重置计时器。 65 66## 示例 67 68```ts 69// xxx.ets 70@Entry 71@Component 72struct TextTimerExample { 73 textTimerController: TextTimerController = new TextTimerController() 74 @State format: string = 'mm:ss.SS' 75 76 build() { 77 Column() { 78 TextTimer({ isCountDown: true, count: 30000, controller: this.textTimerController }) 79 .format(this.format) 80 .fontColor(Color.Black) 81 .fontSize(50) 82 .onTimer((utc: number, elapsedTime: number) => { 83 console.info('textTimer notCountDown utc is：' + utc + ', elapsedTime: ' + elapsedTime) 84 }) 85 Row() { 86 Button("start").onClick(() => { 87 this.textTimerController.start() 88 }) 89 Button("pause").onClick(() => { 90 this.textTimerController.pause() 91 }) 92 Button("reset").onClick(() => { 93 this.textTimerController.reset() 94 }) 95 } 96 } 97 } 98} 99``` 100 101 102 103
