HarmonyOS】ArkTS学习之基于TextTimer的简易计时器的elapsedTime最小时间单位问题

本文旨在纪录自己对TextTimer使用过程的疑惑问题
我在查看教程时候,发现很多博客在onTimer(event: (utc: number, elapsedTime: number) => void) 这里提到elapsedTime:计时器经过的时间,单位为毫秒。我不清楚是否为版本问题。
在我查看version11和version10的api时候,说的都是设置格式的最小单位。
在这里插入图片描述
经过个人检验的情况是:version11和version10都是依据格式(format)的最小单位设置的。
例如:

@Entry
@Component
struct TextTimerExample {
    
    
  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(50)
        .onTimer((utc: number, elapsedTime: number) => {
    
    
          console.info('textTimer notCountDown utc is:' + utc + ', elapsedTime: ' + elapsedTime)
        })
      Row() {
    
    
        Button("start").onClick(() => {
    
    
          this.textTimerController.start()
        })
        Button("pause").onClick(() => {
    
    
          this.textTimerController.pause()
        })
        Button("reset").onClick(() => {
    
    
          this.textTimerController.reset()
        })
      }
    }
  }
}

在这里插入图片描述
这里显然·应该是5300毫秒,但是显示530,如果考虑到format中最小为SS,也就是10ms,那么就说得通了
同理:

import router from '@ohos.router'

@Entry
@Component
struct TextTimerPage {
    
    
  @State message: string = '通过文本显示计时信息并控制其计时器状态的组件。'
  @State onTimerContent: string = ''
  // TextTimer的控制器
  private controller: TextTimerController = new TextTimerController()

  build() {
    
    
    Row() {
    
    
      Scroll() {
    
    
        Column() {
    
    
          Text(this.message)
            .fontSize(20)
            .fontWeight(FontWeight.Bold)
            .width('96%')
          Blank(12)
          TextTimer({
    
     isCountDown: true, count: 120000, controller: this.controller })
            .fontSize(20)
            .fontColor(Color.Red)
            .format('mm:ss')
            .onTimer((utc: number, elapsedTime: number) => {
    
     // utc 时间戳, elapsedTime计时器经过的时间
              this.onTimerContent = 'textTimer 时间戳 utc is:' + utc + ', 计时器经过的时间 elapsedTime: ' + elapsedTime;
            })
          Blank(12)
          Row() {
    
    
            Button('计时器启动').width('30%').onClick(() => {
    
    
              this.controller.start();
            })
            Button('计时器暂停').width('30%').margin({
    
     left: '2.5%', right: '2.5%' }).onClick(() => {
    
    
              this.controller.pause();
            })
            Button('计时器重置').width('30%').onClick(() => {
    
    
              this.controller.reset();
            })
          }
          .alignItems(VerticalAlign.Center)

          Blank(12)
          Text(this.onTimerContent).width('96%').fontSize(20).fontColor(Color.Red)
          Blank(12)
          Button("文本文档")
            .fontSize(20)
            .backgroundColor('#007DFF')
            .width('96%')
            .onClick(() => {
    
    
              // 处理点击事件逻辑
              router.pushUrl({
    
    
                url: "pages/baseComponent/textTimer/TextTimerDesc",
              })
            })

        }
        .width('100%')
      }
    }
    .padding({
    
     top: 12, bottom: 12 })
  }
}

在这里插入图片描述

这里应该是5s,也就是5000ms,如果考虑format中的最小单位为s,也说得通

再次考虑这个情况:

// xxx.ets
@Entry
@Component
struct TextTimerExample {
    
    
  textTimerController: TextTimerController = new TextTimerController()

  build() {
    
    
    Column() {
    
    
      TextTimer({
    
    controller: this.textTimerController})
        .format('mm:ss:SSS')
        .fontColor(Color.Black)
        .fontSize(50)
        .onTimer((utc: number, elapsedTime: number) => {
    
    
          console.info('textTimer notCountDown utc is:' + utc + ', elapsedTime: ' + elapsedTime)
        })
      Row() {
    
    
        Button("start").onClick(() => {
    
    
          this.textTimerController.start();
        });
        Button("pause").onClick(() => {
    
    
          this.textTimerController.pause();
        });
        Button("reset").onClick(() => {
    
    
          this.textTimerController.reset();
        });
      }
    }
  }
}

在这里插入图片描述
此时就是以毫秒做单位了

但是又出现一个情况:
我师兄在使用version11时候,即使format是SS结尾,也可以到毫秒,这就不清楚什么原因了。

总之,本文只做自己学习中遇到的疑惑纪录。

猜你喜欢

转载自blog.csdn.net/weixin_44628096/article/details/142005326