DetailDialog.ets 1.44 KB
@Preview
@CustomDialog
export struct DetailDialog {
  controller: CustomDialogController
  @Prop name: string
  @Prop title: string
  @Prop summary: string
  @Link isOpen: boolean

  build() {
    Column() {
      if (this.name) {
        Text(`@${this.name}`)
          .fontColor(Color.White)
          .fontSize(14)
          .fontWeight(600)
          .lineHeight(17)
      }

      if (this.title) {
        Text(this.title)
          .fontColor(Color.White)
          .fontSize(16)
          .fontWeight(600)
          .margin({ top: 8 })
          .lineHeight(24)
      }

      Text(this.summary)
        .fontColor(Color.White)
        .fontSize(14)
        .fontWeight(400)
        .margin({ top: 8 })
        .lineHeight(21)

      Row() {
        Image($r('app.media.ic_close'))
          .height(24).margin({ top: 20 }).onClick(() => {
          this.controller.close()
          if (this.isOpen) {
            this.isOpen = !this.isOpen
          }
        })
      }.width('100%').justifyContent(FlexAlign.Center)

    }
    .width('100%')
    .alignItems(HorizontalAlign.Start)
    .backgroundColor('#80000000')
    // .linearGradient({
    //   direction: GradientDirection.Top, // 渐变方向
    //   repeating: false, // 渐变颜色是否重复
    //   colors: [['rgba(0, 0, 0, 0.1)', 0.0], ['rgba(0, 0, 0, 0)', 1.0]] // 数组末尾元素占比小于1时满足重复着色效果
    // })
    .padding({ top: 20, bottom: 30, left: 16, right: 16 })
  }
}