解决首页pageShow/hide传递给子组件

@@ -3,11 +3,14 @@ export interface RmhInfoDTO {
   authTitle: string;
   authTitle2: string;
   banControl: number;
-  cnIsAttention: number;
+  cnIsAttention?: number;
+  cnAttention?: number;
+  cnlsComment?: number;
+  cnlsLike?: number;
   cnMainControl: number;
   cnShareControl: number;
-  cnIsComment: number;
-  cnIsLike: number;
+  cnIsComment?: number;
+  cnIsLike?: number;
   posterShareControl: number;
   rmhDesc: string;
   rmhHeadUrl: string;

@@ -91,6 +91,7 @@ export struct BottomNavigationComponent {
       // this.onBottomNavigationIndexChange()
     })
     .backgroundColor(this.barBackgroundColor)
+    .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
 
     // .padding({ bottom: this.bottomRectHeight + 'px', top: this.topRectHeight + 'px' }) // 此处margin具体数值在实际中应与导航条区域高度保持一致
 

@@ -32,20 +32,20 @@ export struct DetailPlayShortVideoPage {
   @Provide videoLandScape?: number = 1; // 视频朝向， 横屏视频：1;竖屏视频：2
   @Provide newsStatusOfUser: batchLikeAndCollectResult | undefined = undefined // 点赞、收藏状态
   @Provide followStatus: string = '0' // 关注状态
-  @Link @Watch('switchVideoStatusChange') switchVideoStatus: boolean
+  @Consume @Watch('pageShowChange') pageShow: number
+  @Consume @Watch('pageHideChange') pageHide: number
 
-  /**
-   * 直播频道从其他频道切换回来需要继续播放视频
-   */
-  switchVideoStatusChange() {
-    if (this.switchVideoStatus) {
+  pageShowChange() {
     if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_PAUSE) {
       this.playerController.play()
+      this.queryNewsInfoOfUser()
     }
-    } else {
+  }
+
+  pageHideChange() {
     if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_START) {
       this.playerController.pause()
-      }
+
     }
   }
 
@@ -68,9 +68,7 @@ export struct DetailPlayShortVideoPage {
     }
   }
 
-  /**
-   * 查询用户点赞、收藏、关注等状态
-   */
+  // 查询用户点赞、收藏、关注等状态
   queryNewsInfoOfUser() {
     if (HttpUrlUtils.getUserId()) {
       const params: batchLikeAndCollectParams = {
@@ -118,46 +116,32 @@ export struct DetailPlayShortVideoPage {
   }
 
   aboutToAppear() {
-    // console.log('开始设置setContentDetailData', JSON.stringify(this.contentDetailData))
     this.videoLandScape = this.contentDetailData?.videoInfo[0]?.videoLandScape
-    this.queryNewsInfoOfUser()
     this.playerController.onCanplay = () => {
       if (this.index == 0 || this.currentIndex === this.index) {
         this.playerController.play()
       }
     }
-
     this.playerController.onTimeUpdate = (position, duration) => {
       this.progressVal = Math.floor(position * 100 / duration);
     }
-
-    // 设置播放地址
-    let listener = mediaquery.matchMediaSync('(orientation: landscape)');
-    listener.on("change", (mediaQueryResult) => {
-      if (mediaQueryResult.matches) {
-        console.log("横屏 yes")
-        this.isFullScreen = true
-      } else {
-        this.isFullScreen = false
-        console.log("横屏 no")
+    this.queryNewsInfoOfUser()
   }
-      // WindowModel.shared.setMainWindowFullScreen(this.isFullScreen)
-    })
 
+  aboutToDisappear(): void {
+    console.log(TAG, 'aboutToDisappear', this.index)
+    this.playerController?.pause()
+    this.playerController?.release();
   }
 
   onPageShow() {
+    console.log(TAG, 'onPageShow')
+    this.queryNewsInfoOfUser()
     // this.playerController?.play();
-    // WindowModel.shared.setPreferredOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED);
-  }
-
-  aboutToDisappear(): void {
-    console.log('aboutToDisappear', this.index)
-    this.playerController?.pause()
-    this.playerController?.release();
   }
 
   onPageHide() {
+    console.log(TAG, 'onPageHide')
     this.playerController?.pause();
   }
 

@@ -16,7 +16,11 @@ export struct DetailVideoListPage {
   private relId: string = ''
   private relType: string = ''
   private swiperController: SwiperController = new SwiperController()
+  @Provide bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
+  @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
   @Provide showComment: boolean = true
+  @Provide pageShow: number = -1
+  @Provide pageHide: number = -1
   @State data: ContentDetailDTO[] = []
   @State testData: string[] = ['111', '222', '333']
   @State currentIndex: number = 0
@@ -48,17 +52,17 @@ export struct DetailVideoListPage {
     this.closeFullScreen()
   }
 
+  // page show/hide只能在外层组件触发
   onPageShow(): void {
     console.log(TAG, 'onPageShow')
+    this.pageShow = Math.random()
     this.openFullScreen()
 
-    console.log('getWindowProperties', JSON.stringify(WindowModel.shared.getWindowProperties()))
-
-
   }
 
   onPageHide(): void {
     console.log(TAG, 'onPageHide')
+    this.pageHide = Math.random()
     this.closeFullScreen()
   }
 
@@ -68,7 +72,7 @@ export struct DetailVideoListPage {
    */
   openFullScreen() {
     WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', })
-    // WindowModel.shared.setWindowLayoutFullScreen(true)
+    WindowModel.shared.setWindowLayoutFullScreen(true)
     // WindowModel.shared.setWindowSystemBarEnable([])
   }
 
@@ -78,7 +82,7 @@ export struct DetailVideoListPage {
    */
   closeFullScreen() {
     WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', })
-    // WindowModel.shared.setWindowLayoutFullScreen(false)
+    WindowModel.shared.setWindowLayoutFullScreen(false)
     // WindowModel.shared.setWindowSystemBarEnable(['status', 'navigation'])
   }
 
@@ -105,6 +109,7 @@ export struct DetailVideoListPage {
     }).then(res => {
       if (res.data) {
         this.data = this.data.concat(res.data)
+        console.log('视频列表===', JSON.stringify(res.data))
       }
     })
   }
@@ -138,7 +143,6 @@ export struct DetailVideoListPage {
       Swiper(this.swiperController) {
         ForEach(this.data, (item: ContentDetailDTO, index: number) => {
           DetailPlayShortVideoPage({
-            switchVideoStatus: $switchVideoStatus,
             contentDetailData: item,
             currentIndex: this.currentIndex,
             index: index,
@@ -155,9 +159,8 @@ export struct DetailVideoListPage {
       .displayCount(1, true)
       .onChange((index: number) => {
         this.currentIndex = index
-        console.info('onChange==', index.toString())
-
         if (this.currentIndex === this.data.length - 1) {
+          // TODO:下拉刷新“努力加载中”
           this.queryVideoList()
         }
       })
@@ -165,6 +168,9 @@ export struct DetailVideoListPage {
     .width('100%')
     .height('100%')
     .backgroundColor(Color.Black)
-    .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM, SafeAreaEdge.START, SafeAreaEdge.END])
+    .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
+    .padding({
+      bottom: this.bottomSafeHeight + 'px'
+    })
   }
 }
\ No newline at end of file

@@ -2,35 +2,11 @@
 @Component
 export struct Test {
   build() {
+    Column() {
       Row() {
-
-      RelativeContainer() {
-        Image($r('app.media.ic_like_uncheck'))
-          .width('100%')
-          .borderRadius(24)
-          .aspectRatio(1)
-          .border({ width: 1, color: Color.White, style: BorderStyle.Solid })
-          .alignRules({
-            top: { anchor: "__container__", align: VerticalAlign.Top },
-            left: { anchor: "__container__", align: HorizontalAlign.Start }
-          })
-          .id("row1")
-
-        Image($r('app.media.ic_add'))
-          .width(24)
-          .borderRadius(12)
-          .alignRules({
-            left: { anchor: "__container__", align: HorizontalAlign.Center },
-            bottom: { anchor: "__container__", align: VerticalAlign.Bottom },
-          })
-          .margin({ left: -12 })
-          .id("row2")
-      }.height('auto')
-
+        Text('111')
       }
-    .height(58)
-    .width(48)
-    .backgroundColor(Color.Black)
-
+    }.width('100%')
+    .backgroundColor('#cccccc')
   }
 }
\ No newline at end of file

@@ -216,7 +216,6 @@ export struct VideoChannelDetail {
         ForEach(this.data, (item: ContentDetailDTO, index: number) => {
           Column() {
             DetailPlayShortVideoPage({
-              switchVideoStatus: $switchVideoStatus,
               contentDetailData: item,
               currentIndex: this.currentIndex,
               index: index,

+@Preview
 @CustomDialog
 export struct DetailDialog {
   controller: CustomDialogController
@@ -8,8 +9,8 @@ export struct DetailDialog {
 
   build() {
     Column() {
-      if (this.name + '1222222') {
-        Text(`@${this.name}` + '1222222')
+      if (this.name) {
+        Text(`@${this.name}`)
           .fontColor(Color.White)
           .fontSize(14)
           .fontWeight(600)

+import { WDPlayerController } from 'wdPlayer/Index';
+import { PlayerTitleView } from './PlayerTitleView'
+
+@Component
+export struct PlayerBottomView {
+  private playerController?: WDPlayerController;
+
+  build() {
+    Column() {
+      PlayerTitleView()
+    }
+    .position({ x: 0, y: '100%' })
+
+    // .markAnchor({ x: 56, y: 56 })
+  }
+}
\ No newline at end of file

@@ -14,51 +14,6 @@ export struct PlayerDetailContainer {
     console.log(`PlayerDetailContainer aboutToAppear`)
   }
 
-  buildVideoHeight() {
-    let videoHeight: string | number = 200
-    if (this.videoLandScape == 2) {
-      videoHeight = '100%'
-    } else {
-      videoHeight = 200
-    }
-    console.log(`PlayerDetailContainer buildVideoHeight:${videoHeight}  `)
-    return videoHeight
-  }
-
-  buildVideoTo() {
-    let videoTop: number;
-    if (this.videoLandScape == 2) {
-      videoTop = 0
-    } else {
-      videoTop = 174
-    }
-    console.log(`PlayerDetailContainer videoTop:${videoTop} `)
-    return videoTop
-  }
-
-  buildVideoBottom() {
-    let videoBottom: number;
-    if (this.videoLandScape == 2) {
-      videoBottom = 0
-    } else {
-      videoBottom = 320
-    }
-    console.log(`PlayerDetailContainer buildVideoBottom:${videoBottom} `)
-    return videoBottom
-  }
-
-  isShowBottomView() {
-    console.log(`PlayerDetailContainer videoLandScape:${this.videoLandScape} `)
-    let isShowBottom: boolean = false
-    if (this.isFullScreen) {
-      isShowBottom = false
-    } else {
-      isShowBottom = true
-    }
-    console.log(`PlayerDetailContainer isShowBottom:${isShowBottom} `)
-    return isShowBottom
-  }
-
   build() {
     Stack() {
       this.playerView()

+@Component
+export struct PlayerRightView {
+  build() {
+  }
+}
\ No newline at end of file

@@ -49,8 +49,14 @@ export struct PlayerTitleComment {
 
   getName() {
     // console.error(this.contentDetailData?.newsSourceName + '===========' + this.contentDetailData?.editorName)
+    // this.contentDetailData?.newsSourceName ||  authTitle
+    return this.contentDetailData?.rmhInfo?.rmhName || ''
+  }
+
+  getIcon() {
+    // console.error(this.contentDetailData?.newsSourceName + '===========' + this.contentDetailData?.editorName)
     // this.contentDetailData?.newsSourceName ||
-    return this.contentDetailData?.editorName || ''
+    return this.contentDetailData?.rmhInfo?.authIcon || ''
   }
 
   getTitle() {
@@ -99,11 +105,16 @@ export struct PlayerTitleComment {
       Row() {
         Column() {
           if (this.getName()) {
+            Row() {
               Text("@" + this.getName())
                 .fontColor(Color.White)
                 .fontSize(15)
                 .maxLines(1)
                 .textOverflow({ overflow: TextOverflow.Ellipsis })
+              if (this.getIcon()) {
+                Image(this.getIcon()).height(10).margin({ left: 4 })
+              }
+            }
           }
           if (this.getTitle()) {
             Text(this.getTitle())

+import measure from '@ohos.measure'
+import { ContentDetailDTO } from 'wdBean/Index'
+import { DetailDialog } from './DetailDialog'
+import { componentUtils } from '@kit.ArkUI'
+
+@Preview
+@Component
+export struct PlayerTitleView {
+  @Consume contentDetailData: ContentDetailDTO
+  @State isOpen: boolean = false
+  @State titleHeight: number = 0
+  dialogController: CustomDialogController = new CustomDialogController({
+    builder: DetailDialog({
+      name: this.getName(),
+      title: this.getTitle(),
+      summary: this.getSummary(),
+      isOpen: this.isOpen
+
+    }),
+    autoCancel: false,
+    customStyle: true,
+    alignment: DialogAlignment.Bottom
+  })
+
+  getName(): string {
+    // authTitle
+    return this.contentDetailData?.rmhInfo?.rmhName || ''
+  }
+
+  getIcon(): string {
+    return this.contentDetailData?.rmhInfo?.authIcon || ''
+  }
+
+  getTitle(): string {
+    return this.contentDetailData?.newsTitle || ''
+  }
+
+  getSummary(): string {
+    return this.contentDetailData?.newsSummary || ''
+  }
+
+  aboutToAppear(): void {
+    const info = measure.measureTextSize({
+      textContent: this.getTitle(),
+      fontSize: 15,
+      fontWeight: 400,
+      lineHeight: 20,
+      constraintWidth: 287 - 16 - 22,
+
+    })
+    this.titleHeight = info?.height as number || 0
+  }
+
+  build() {
+    Column() {
+      if (this.getName()) {
+        Row() {
+          Text("@" + this.getName())
+            .fontColor(Color.White)
+            .fontSize(17)
+            .maxLines(1)
+            .lineHeight(25)
+            .fontWeight(600)
+            .textOverflow({ overflow: TextOverflow.Ellipsis })
+
+          if (this.getIcon()) {
+            Image(this.getIcon()).height(10).margin({ left: 4 })
+          }
+        }.margin({ bottom: 8 })
+
+      }
+
+      Text(this.getTitle())
+        .fontColor(Color.White)
+        .fontSize(15)
+        .maxLines(3)
+        .lineHeight(20)
+        .fontWeight(400)
+        .textOverflow({ overflow: TextOverflow.Ellipsis })
+        .margin({ bottom: 8 })
+
+      /**
+       * 标题大于三行或存在简介显示查看详情按钮
+       */
+      if (this.titleHeight > 180 || this.contentDetailData?.newsSummary) {
+        Text('查看详情 > ')
+          .padding({ left: 6, right: 6, top: 4, bottom: 4 })
+          .borderRadius(2)
+          .backgroundColor('#99636363')
+          .fontColor(Color.White)
+          .fontSize(12)
+          .lineHeight(14)
+          .fontWeight(400)
+          .onClick(() => {
+            this.isOpen = true
+            this.dialogController?.open()
+          })
+      }
+
+    }
+    .backgroundColor(Color.Black)
+    .width(287)
+    .padding({ left: 16, right: 22 })
+    .alignItems(HorizontalAlign.Start)
+  }
+}
\ No newline at end of file

@@ -73,13 +73,12 @@ export struct WDPlayerRenderView {
     Row() {
       // 设置为“surface“类型时XComponent组件可以和其他组件一起进行布局和渲染。
       XComponent({
-        id: 'xComponentId',
-        type: 'surface',
+        id: this.insId,
+        type: XComponentType.SURFACE,
         controller: this.xComponentController
       })
         .onLoad(async (event) => {
           Logger.info(TAG, 'onLoad')
-          // const surfaceId = this.xComponentController.getXComponentSurfaceId()
           this.xComponentController.setXComponentSurfaceSize({
             surfaceWidth: 1920,
             surfaceHeight: 1080
@@ -89,13 +88,16 @@ export struct WDPlayerRenderView {
             this.onLoad(event)
           }
         })
-        .width(this.selfSize.width)
-        .height(this.selfSize.height)
+        .width('100%')// .width(this.selfSize.width)
+          // .height(this.selfSize.height)
+        .aspectRatio(this.videoWidth / this.videoHeight)
+        .renderFit(RenderFit.RESIZE_COVER)
     }
-    .id(this.insId)
-    .onAreaChange(() => {
+
+    // .onAreaChange(() => {
     // this.updateLayout()
-    })
+    // })
+
     .backgroundColor("#000000")
 
     // .height('100%')
@@ -103,15 +105,21 @@ export struct WDPlayerRenderView {
   }
 
   updateLayout() {
-    let info = componentUtils.getRectangleById(this.insId);
-    if (info.size.width > 0 && info.size.height > 0 && this.videoHeight > 0 && this.videoWidth > 0) {
-      if (info.size.width / info.size.height > this.videoWidth / this.videoHeight) {
-        let scale = info.size.height / this.videoHeight;
-        this.selfSize = new Size((this.videoWidth * scale / info.size.width) * 100 + "%", '100%');
+    // let info = componentUtils.getRectangleById(this.insId);
+    const windowRect = WindowModel.shared.getWindowProperties()?.windowRect
+    if (windowRect) {
+      const info = windowRect
+      if (info.width > 0 && info.height > 0 && this.videoHeight > 0 && this.videoWidth > 0) {
+        if (info.width / info.height > this.videoWidth / this.videoHeight) {
+          let scale = info.height / this.videoHeight;
+          this.selfSize = new Size((this.videoWidth * scale / info.width) * 100 + "%", '100%');
         } else {
-        let scale = info.size.width / this.videoWidth;
-        this.selfSize = new Size('100%', (this.videoHeight * scale / info.size.height) * 100 + "%");
+          let scale = info.width / this.videoWidth;
+          this.selfSize = new Size('100%', (this.videoHeight * scale / info.height) * 100 + "%");
         }
       }
     }
+
+
+  }
 }
\ No newline at end of file

-import { BottomNavigationComponent, LogoutViewModel} from 'wdComponent';
+import { BottomNavigationComponent, LogoutViewModel } from 'wdComponent';
 import { BreakpointConstants } from 'wdConstant';
 
 import { BreakpointSystem, EmitterEventId, EmitterUtils, Logger } from 'wdKit';
@@ -12,7 +12,8 @@ const TAG = 'MainPage';
 @Entry
 @Component
 struct MainPage {
-
+  @Provide pageShow: number = -1
+  @Provide pageHide: number = -1
   private breakpointSystem: BreakpointSystem = new BreakpointSystem()
   @StorageLink('currentBreakpoint') @Watch('watchCurrentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_XS;
 
@@ -34,9 +35,14 @@ struct MainPage {
     Logger.info(TAG, 'aboutToDisappear');
   }
 
-
   onPageHide() {
     Logger.info(TAG, 'onPageHide');
+    this.pageHide = Math.random()
+  }
+
+  onPageShow() {
+    Logger.info(TAG, 'onPageShow');
+    this.pageShow = Math.random()
   }
 
   onBackPress() {