ArkTs商城（一）

邀请您共同编写ArkTs思维导图后续会继续更新，欢迎关注~

项目结构

项目开发

StartPage.ts

`

import router from '@ohos.router';
@Entry
@Component
struct StartPage {
  private timer: any = null;
  @State  Countdown: number = 6;
  aboutToAppear() {
    this.timer = setInterval(() => {
      this.Countdown--;
      if (this.Countdown === 0) {
        router.replaceUrl({
          url: 'pages/MainPage'
        })
      }

    }, 1000);
  }

  aboutToDisappear() {
    clearTimeout(this.timer)
  }

  build() {
    Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center}) {
      Column() {
        Image($r('app.media.ic_eshop'))
          .height(120)
          .width(120)
          .objectFit(ImageFit.Contain)
          .aspectRatio(1)
        Text(`${this.Countdown}`)
            .fontColor(Color.Black)
            .fontSize(24)
          .position({
            x: '42%',
            y: '10%'
          })

      }
      .justifyContent(FlexAlign.Center)
      .alignItems(HorizontalAlign.Center)
      .flexGrow(1)
      Image($r('app.media.ic_title'))
        .width(114)
        .height(27)
        .objectFit(ImageFit.Contain)
      Text('购物总有新玩法')
        .fontColor('#ADADAD')
        .fontSize(22)
        .letterSpacing(16)
        .margin({
          top: 12,
          bottom: 136
        })
    }
    .width('100%')
    .height('100%')
    .backgroundColor('#f1f3f5')
  }
}

`

效果预览

ArkTs语言导图

后续持续更新~