PaperTitleComponent.ets 2.31 KB
import router from '@ohos.router';

/**
 * 早晚报页面标题bar
 */
@Entry
@Component
export struct PaperTitleComponent {
  @State title?: string = 'title'
  @State subtitle?: string = 'subtitle'

  aboutToAppear() {
  }

  build() {
    RelativeContainer() {
      Image($r('app.media.icon_read_paper'))
        .height($r('app.float.top_arrow_size'))
        .width($r('app.float.top_arrow_size'))
        .alignRules({
          left: { anchor: "__container__", align: HorizontalAlign.Start },
          center: { anchor: "__container__", align: VerticalAlign.Center }
        })
        .visibility(Visibility.None)
        .id('img_logo1')

      Row() {
        Text(this.title ?? "")
          .margin({ left: 5 })
          .fontSize(20)
          .fontColor($r('app.color.white'))
          .maxLines(1)

        Text(this.subtitle ?? '')// Text('2024年\n1月16日')
          // .width(50)
          .margin({ left: 5 })
          .fontSize(12)
          .fontColor($r('app.color.white'))
          .maxLines(2)

        Image($r('app.media.bg_event_status_end'))
          .height($r('app.float.top_arrow_size'))
          .width(100)
          .visibility(Visibility.None)
      }
      .height('100%')
      .alignItems(VerticalAlign.Center)
      .alignRules({
        left: { anchor: "img_logo1", align: HorizontalAlign.End },
        center: { anchor: "__container__", align: VerticalAlign.Center } })
      .id('row_paper_date')

      Image($r('app.media.icon_close'))
        .height($r('app.float.top_arrow_size'))
        .width($r('app.float.top_arrow_size'))
        .alignRules({
          right: { anchor: "__container__", align: HorizontalAlign.End },
          center: { anchor: "__container__", align: VerticalAlign.Center } })
        .id('img_close')
        .onClick((event: ClickEvent) => {
          // console.info(TAG, "img_close")
          router.back()
        })

      Image($r('app.media.icon_share'))
        .height($r('app.float.top_arrow_size'))
        .width($r('app.float.top_arrow_size'))
        .alignRules({
          right: { anchor: "img_close", align: HorizontalAlign.Start },
          center: { anchor: "__container__", align: VerticalAlign.Center } })
        .id('img_share')
    }
    .margin({ left: 14, right: 14 })
    .height($r('app.float.top_bar_height'))
    .backgroundColor(Color.Black)
  }
}