无法在卡片正常使用TextTimer组件

想在卡片上呈现倒计时效果，在开发中发现使用TextTimer组件，发现TextTimerController.start无效。

@Component  
struct TextTimerExample {  
  textTimerController: TextTimerController = new TextTimerController()  
  @State format: string = 'mm:ss.SS'  
  
  build() {  
    Column() {  
      TextTimer({ isCountDown: true, count: 30000, controller: this.textTimerController.start() })  
        .format(this.format)  
        .fontColor(Color.Black)  
        .fontSize(20)  
        .onTimer((utc: number, elapsedTime: number) => {  
          console.info('textTimer notCountDown utc is：' + utc + ', elapsedTime: ' + elapsedTime)  
        })  
    }  
  }  
}1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.

HarmonyOS

zbw_apple

2024-10-11 10:24:51

浏览

回答 1

按赞同

按时间

superinsect

1、将卡片改为动态卡片，即"isDynamic": true。参考链接：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-ui-widget-configuration-V5

2、Button或者onAppear中使用this.textTimerController.start()，参考代码如下：

const storage = new LocalStorage();  
  
// 绑定  
@Entry(storage)  
@Component  
struct WidgetCard {  
  @LocalStorageProp('formId') formId: string = ''  
  @LocalStorageProp('formDimension') formDimension: number = 2  
  @LocalStorageProp('next') next: number = 0  
  textTimerController: TextTimerController = new TextTimerController()  
  @State format: string = 'mm:ss.SS'  
  
  build() {  
    Column() {  
      TextTimer({ isCountDown: true, count: 30000, controller: this.textTimerController })  
        .format(this.format)  
        .fontColor(Color.Black)  
        .fontSize(20)  
        .onTimer((utc: number, elapsedTime: number) => {  
          console.info('textTimer notCountDown utc is：' + utc + ', elapsedTime: ' + elapsedTime)  
        })  
        .onAppear(() => {  
          try {  
            console.info('wytest: enter onAppear')  
            this.textTimerController.start()  
          } catch (error) {  
            console.error('wytest: onAppear err.')  
          }  
        })  
  
      Row() {  
        Button("start").onClick(() => {  
          this.textTimerController.start()  
        })  
        Button("pause").onClick(() => {  
          this.textTimerController.pause()  
        })  
        Button("reset").onClick(() => {  
          this.textTimerController.reset()  
        })  
      }  
    }  
  }  
}1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.

2024-10-11 17:28:25

如何写精华回答，获更多曝光？

发布

51CTO

51CTO博客

51CTO学堂

无法在卡片正常使用TextTimer组件

订阅鸿蒙技术特刊，精选内容抢先看