① 进入动画

import router from '@ohos.router';

@Entry
@Component
struct SplashPage {
  @State flag:Boolean = false


  onPageShow(): void {
   animateTo({duration:1000, onFinish:() => {
     setTimeout(()=>{
       router.replaceUrl({
         url:'pages/loginPage'
       })
     },200);
   }}, ()=> {
      this.flag = true
   })

  }



  build() {
    Column() {
      if (this.flag) {
        Image($r('app.media.ic_logo'))
          .width(90)
          .height(90)
          .margin({ top: 120 })
          .transition({
            type: TransitionType.Insert,
            opacity: 0,
            translate: {x: -150}
          })
        Text('快速单次记忆')
          .fontSize(21)
          .fontColor(Color.White)
          .fontWeight(FontWeight.Bold)
          .margin({ top: 15 })
          .transition({
            type: TransitionType.Insert,
            opacity: 0,
            translate: {x: 150}
          })
      }
      Blank()
      Text('CiBa By HarmonyOs')
        .fontSize(12)
        .fontColor('#546B9D')
        .fontWeight(FontWeight.Bold)
        .margin({ bottom: 30 })
    }
    .bgStyle()
  }



}

@Styles function bgStyle() {
  .width('100%')
  .height('100%')
  .backgroundImage($r('app.media.img_splash_bg'))
  .backgroundImageSize({
    width: '100%',
    height: '100%'
  })
}

② 效果预览