ArkTS实现时钟的方式有哪些？

import { BusinessError } from '@ohos.base' 
import systemDateTime from '@ohos.systemDateTime'; 
 
@Entry 
@Component 
struct Index { 
  @State time: number = 0; 
  @State hours: number = 0; 
  @State minute: number = 0; 
  @State Seconds: number = 0; 
  timeId: number = -1; 
 
  onPageShow() { 
    try { 
      if (this.timeId != -1) { 
        console.log('当前Id为：' + this.timeId) 
        return 
      } 
      systemDateTime.getCurrentTime(false, (error: BusinessError, time: number) => { 
        if (error) { 
          console.info(`Failed to get currentTime. message: ${error.message}, code: ${error.code}`); 
          return; 
        } 
        console.info(`Succeeded in getting currentTime : ${time}`); 
        this.time = time; 
        //获取当前时间的小时，因为有8小时时间差，所以要加上 
        //使用 ~~ 和 Math.floor都可实现向下取整 
        this.hours = ((time + 3600 * 1000 * 8) / (3600 * 1000)) % 24 
        this.minute = ((time + 3600 * 1000 * 8) / (1000 * 60)) % 60 
        this.Seconds = Math.floor(((time + 3600 * 1000 * 8) / 1000) % 60) 
        console.info('hours is :' + this.hours) 
        console.info('minute is :' + this.minute) 
        console.info('Seconds is :' + this.Seconds) 
      }); 
    } catch (e) { 
      let error = e as BusinessError; 
      console.info(`Failed to get currentTime. message: ${error.message}, code: ${error.code}`); 
    } 
 
    //指针移动角度 
    this.timeId = setInterval(() => { 
      this.hours += (1 / 3600); //时针角度 
      this.minute += (1 / 60) //分针角度) 
      this.Seconds += 1; //秒针角度 
      console.info('当前秒数:' + this.Seconds) 
    }, 1000) 
  } 
 
  build() { 
    Row() { 
      Column({ space: 20 }) { 
        Text('获取的当前时间为:' + ~~(this.hours % 24) + ':' + ~~(this.minute % 60) + ':' + (this.Seconds % 60)) 
        //使用精灵图分别获取表盘、时针、分针、秒针 
        Stack() { 
          //表盘 
          Row() 
            .width('740px') 
            .height('710px') 
            .backgroundImage('comment/clock.png', ImageRepeat.NoRepeat) 
            .backgroundImageSize({ 
              width: '988px', 
              height: '800px' 
            }) 
            .backgroundImagePosition({ 
              x: '-190px', 
              y: '-64px' 
            }) 
 
          //时针 
          Row() 
            .width('40px') 
            .height('162px') 
            .backgroundImage('comment/clock.png', ImageRepeat.NoRepeat) 
            .backgroundImageSize({ 
              width: '988px', 
              height: '800px' 
            }) 
            .backgroundImagePosition({ 
              x: '-111px', 
              y: '-536px' 
            }) 
            .position({ 
              x: '350px', 
              y: '212px' 
            }) 
            .rotate({ 
              x: 0, 
              y: 0, 
              z: 1, 
              centerX: '50%', 
              centerY: '89%', 
              centerZ: 0, 
              angle: this.hours * 30 
            }) 
            .animation({ 
              duration: 1000, 
              iterations: 1, 
              curve: Curve.Linear 
            }) 
 
          //分针 
          Row() 
            .width('30px') 
            .height('216px') 
            .backgroundImage('comment/clock.png', ImageRepeat.NoRepeat) 
            .backgroundImageSize({ 
              width: '988px', 
              height: '800px' 
            }) 
            .backgroundImagePosition({ 
              x: '-70px', 
              y: '-480px' 
            }) 
            .position({ 
              x: '356px', 
              y: '156px' 
            }) 
            .rotate({ 
              x: 0, 
              y: 0, 
              z: 1, 
              centerX: '50%', 
              centerY: '94%', 
              centerZ: 0, 
              angle: this.minute * 6, //一分钟走6度 
            }) 
            .animation({ 
              duration: 1000, 
              iterations: 1, 
              curve: Curve.Linear 
            }) 
 
          //秒针 
          Row() 
            .width('36px') 
            .height('320px') 
            .backgroundImage('comment/clock.png', ImageRepeat.NoRepeat) 
            .backgroundImageSize({ 
              width: '988px', 
              height: '800px' 
            }) 
            .backgroundImagePosition({ 
              x: '-22px', 
              y: '-444px' 
            }) 
            .position({ 
              x: '352px', 
              y: '122px' 
            }) 
            .rotate({ 
              x: 0, 
              y: 0, 
              z: 1, 
              centerX: '50%', 
              centerY: '74%', 
              centerZ: 0, 
              angle: this.Seconds * 6 
            }) 
            .animation({ 
              duration: 1000, 
              iterations: 1, 
              curve: Curve.Linear 
            }) 
        } 
      } 
      .width('100%') 
    } 
    .height('100%') 
  } 
}