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