PaperReaderDialog.ets 2.48 KB
/**
 * 简易音频对话框
 * */
@CustomDialog
export struct PaperReaderSimpleDialog {
  private controllerSimple?: CustomDialogController;

  build() {
    Row() {
      Image($r("app.media.icon_audio_pause"))
        .objectFit(ImageFit.Contain)
        .margin(18)
        .width(24)
        .height(24)
    }
    .width(60)
    .height(60)
    .backgroundColor(Color.White)
    .onClick(() => {
      if (this.controllerSimple) {
        this.controllerSimple.close()
      }

    })

  }
}

/**
 * 图文音频对话框
 * */
@CustomDialog
export struct PaperReaderDialog {
  controllerDetail?: CustomDialogController

  build() {
    Stack() {
      Column() { //标题 时间 进度条
        Marquee({
          start: true,
          step: 50,
          loop: Number.POSITIVE_INFINITY,
          fromStart: true,
          src: "Running Marquee starts rolling"
        })
          .width("60%")
          .height(20)
          .fontColor($r("app.color.color_222222"))
          .fontSize(14)
          .margin({ top: 10 })
          .onStart(() => {
            console.info('Marquee animation complete onStart')
          })
          .onBounce(() => {
            console.info('Marquee animation complete onBounce')
          })
          .onFinish(() => {
            console.info('Marquee animation complete onFinish')
          })

        Row() {
          Text("00:00")
            .fontSize($r('app.float.font_size_12'))
            .fontColor($r('app.color.color_999999'))
            .width("49%")
            .height("100%")
          Text("/00:00")
            .fontSize($r('app.float.font_size_12'))
            .fontColor($r('app.color.color_999999'))
            .width("51%")
            .height("100%")

        }
        .width("100%")
        .height(16)
        .margin({ top: 4 })
      }
      .width("100%")
      .height("100%")

      Progress({ value: 0, total: 100, type: ProgressType.Linear })
        .color($r('app.color.color_ED2800'))
        .width("100%")
        .height(3)

      Image($r("app.media.icon_audio_pause"))
        .objectFit(ImageFit.Auto)
        .align(Alignment.End)
        .margin({ right: 12 })

      Image($r("app.media.icon_audio_close"))
        .objectFit(ImageFit.Auto)
        .align(Alignment.End)
        .margin({ right: 48 })
        .onClick(() => {
          if (this.controllerDetail) {
            this.controllerDetail.close()
          }
        })
    }
    .width("65%")
    .height(60)
    .backgroundColor(Color.White)
    .borderRadius(5)
  }
}