修改播放器页面布局与查看更多条件判断

-import mediaquery from '@ohos.mediaquery';
 import { ContentDetailDTO, InteractDataDTO } from 'wdBean';
 import { ContentDetailDTO, InteractDataDTO } from 'wdBean';
 import { PlayerConstants, WDPlayerController, WDPlayerRenderView } from 'wdPlayer';
 import { PlayerConstants, WDPlayerController, WDPlayerRenderView } from 'wdPlayer';
-import { ContentDetailRequest, devicePLSensorManager } from 'wdDetailPlayApi';
-import { PlayControlViewContainer } from '../view/PlayControlViewContainer';
-import { PlayerDetailContainer } from '../view/PlayerDetailContainer';
-import { DetailContainer } from '../view/DetailContainer';
+import { ContentDetailRequest } from 'wdDetailPlayApi';
 import {
 import {
   batchLikeAndCollectParams,
   batchLikeAndCollectParams,
   batchLikeAndCollectResult,
   batchLikeAndCollectResult,
@@ -13,6 +9,8 @@ import {
 } from 'wdDetailPlayApi/src/main/ets/request/ContentDetailRequest';
 } from 'wdDetailPlayApi/src/main/ets/request/ContentDetailRequest';
 import { HttpUrlUtils } from 'wdNetwork/Index';
 import { HttpUrlUtils } from 'wdNetwork/Index';
 import { DateTimeUtils } from 'wdKit/Index';
 import { DateTimeUtils } from 'wdKit/Index';
+import { PlayerBottomView } from '../view/PlayerBottomView';
+import { PlayerRightView } from '../view/PlayerRightView';
 
 
 const TAG = 'DetailPlayShortVideoPage';
 const TAG = 'DetailPlayShortVideoPage';
 
 
@@ -32,6 +30,7 @@ export struct DetailPlayShortVideoPage {
   @Provide videoLandScape?: number = 1; // 视频朝向， 横屏视频：1;竖屏视频：2
   @Provide videoLandScape?: number = 1; // 视频朝向， 横屏视频：1;竖屏视频：2
   @Provide newsStatusOfUser: batchLikeAndCollectResult | undefined = undefined // 点赞、收藏状态
   @Provide newsStatusOfUser: batchLikeAndCollectResult | undefined = undefined // 点赞、收藏状态
   @Provide followStatus: string = '0' // 关注状态
   @Provide followStatus: string = '0' // 关注状态
+  @Provide isOpenDetail: boolean = false
   @Consume @Watch('pageShowChange') pageShow: number
   @Consume @Watch('pageShowChange') pageShow: number
   @Consume @Watch('pageHideChange') pageHide: number
   @Consume @Watch('pageHideChange') pageHide: number
 
 
@@ -45,14 +44,15 @@ export struct DetailPlayShortVideoPage {
   pageHideChange() {
   pageHideChange() {
     if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_START) {
     if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_START) {
       this.playerController.pause()
       this.playerController.pause()
-
     }
     }
   }
   }
 
 
+  /**
+   * 监听下标变化手动创建或销毁视频
+   */
   currentIndexChange() {
   currentIndexChange() {
     if (this.currentIndex != this.index) {
     if (this.currentIndex != this.index) {
       this.playerController.pause()
       this.playerController.pause()
-
       if (this.index < this.currentIndex - 3 && this.playerController.getPlayer()) {
       if (this.index < this.currentIndex - 3 && this.playerController.getPlayer()) {
         this.playerController.release()
         this.playerController.release()
       }
       }
@@ -64,11 +64,12 @@ export struct DetailPlayShortVideoPage {
       } else {
       } else {
         this.playerController.play()
         this.playerController.play()
       }
       }
-
     }
     }
   }
   }
 
 
-  // 查询用户点赞、收藏、关注等状态
+  /**
+   * 查询用户点赞、收藏、关注状态、记录浏览历史
+   */
   queryNewsInfoOfUser() {
   queryNewsInfoOfUser() {
     if (HttpUrlUtils.getUserId()) {
     if (HttpUrlUtils.getUserId()) {
       const params: batchLikeAndCollectParams = {
       const params: batchLikeAndCollectParams = {
@@ -98,7 +99,7 @@ export struct DetailPlayShortVideoPage {
         }
         }
       })
       })
 
 
-      //   记录浏览历史
+      // 记录浏览历史
       const params2: postInteractBrowsOperateParams = {
       const params2: postInteractBrowsOperateParams = {
         delStatus: 0,
         delStatus: 0,
         contentList: [{
         contentList: [{
@@ -134,19 +135,19 @@ export struct DetailPlayShortVideoPage {
     this.playerController?.release();
     this.playerController?.release();
   }
   }
 
 
-  onPageShow() {
-    console.log(TAG, 'onPageShow')
-    this.queryNewsInfoOfUser()
-    // this.playerController?.play();
-  }
-
-  onPageHide() {
-    console.log(TAG, 'onPageHide')
-    this.playerController?.pause();
+  build() {
+    Stack({ alignContent: Alignment.Top }) {
+      this.playerViewBuilder()
+      PlayerBottomView()
+      PlayerRightView()
+       
+    }
+    .height('100%')
+    .width('100%')
   }
   }
 
 
   @Builder
   @Builder
-  playerViewContainerBuilder() {
+  playerViewBuilder() {
     // 播放窗口
     // 播放窗口
     WDPlayerRenderView({
     WDPlayerRenderView({
       playerController: this.playerController,
       playerController: this.playerController,
@@ -165,36 +166,4 @@ export struct DetailPlayShortVideoPage {
         this.playerController?.switchPlayOrPause();
         this.playerController?.switchPlayOrPause();
       })
       })
   }
   }
-
-  @Builder
-  playControlViewContainerBuilder() {
-    // 播放窗口控制bar
-    PlayControlViewContainer({
-      playerController: this.playerController
-    })
-  }
-
-  @Builder
-  detailContainerBuilder() {
-    DetailContainer({
-      playerController: this.playerController
-    })
-  }
-
-  build() {
-    Column() {
-      PlayerDetailContainer({
-        playerView: () => {
-          this.playerViewContainerBuilder()
-        }, playControlView: () => {
-          // this.playControlViewContainerBuilder()
-        }, detailView: () => {
-          this.detailContainerBuilder()
-        }
-      })
-    }
-    .height('100%')
-    .width('100%')
-
-  }
 }
 }

@@ -18,6 +18,7 @@ export struct DetailVideoListPage {
   private swiperController: SwiperController = new SwiperController()
   private swiperController: SwiperController = new SwiperController()
   @Provide bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
   @Provide bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
   @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
   @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
+  @Provide windowWidth: number = AppStorage.get<number>('windowWidth') || 0
   @Provide showComment: boolean = true
   @Provide showComment: boolean = true
   @Provide pageShow: number = -1
   @Provide pageShow: number = -1
   @Provide pageHide: number = -1
   @Provide pageHide: number = -1

@@ -2,11 +2,22 @@
 @Component
 @Component
 export struct Test {
 export struct Test {
   build() {
   build() {
-    Column() {
+    Stack({ alignContent: Alignment.Top }) {
+
+      Text('视频').width('100%').height('50%').backgroundColor('#000').fontColor(Color.White)
+
       Row() {
       Row() {
-        Text('111')
+        Text('title')
+        Text('contentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontent')
       }
       }
-    }.width('100%')
+      .backgroundColor('#ff0000')
+      .align(Alignment.BottomStart)
+      .position({ y: '100%' })
+      .markAnchor({ y: '100%' })
+
+    }
+    .width(300)
+    .height(600)
     .backgroundColor('#cccccc')
     .backgroundColor('#cccccc')
   }
   }
 }
 }

@@ -25,7 +25,9 @@ interface loadMoreData {
 const TAG = 'VideoChannelDetail'
 const TAG = 'VideoChannelDetail'
 let timer: number = -1
 let timer: number = -1
 
 
-@Entry
+const storage = LocalStorage.getShared();
+ 
+@Entry(storage)
 @Component
 @Component
 export struct VideoChannelDetail {
 export struct VideoChannelDetail {
   private groupId: string = '' // 楼层id
   private groupId: string = '' // 楼层id
@@ -43,6 +45,7 @@ export struct VideoChannelDetail {
   @Link barBackgroundColor: Color
   @Link barBackgroundColor: Color
   private swiperController: SwiperController = new SwiperController()
   private swiperController: SwiperController = new SwiperController()
   @Provide showComment: boolean = false
   @Provide showComment: boolean = false
+  @Provide windowWidth: number = AppStorage.get<number>('windowWidth') || 0
   @State data: ContentDetailDTO[] = []
   @State data: ContentDetailDTO[] = []
   @State currentIndex: number = 0
   @State currentIndex: number = 0
   @State interactDataList: InteractDataDTO[] = []
   @State interactDataList: InteractDataDTO[] = []

@@ -5,7 +5,7 @@ export struct DetailDialog {
   @Prop name: string
   @Prop name: string
   @Prop title: string
   @Prop title: string
   @Prop summary: string
   @Prop summary: string
-  @Link isOpen: boolean
+  @Link isOpenDetail: boolean
 
 
   build() {
   build() {
     Column() {
     Column() {
@@ -15,6 +15,7 @@ export struct DetailDialog {
           .fontSize(14)
           .fontSize(14)
           .fontWeight(600)
           .fontWeight(600)
           .lineHeight(17)
           .lineHeight(17)
+          .margin({ top: 8 })
       }
       }
 
 
       if (this.title) {
       if (this.title) {
@@ -37,8 +38,8 @@ export struct DetailDialog {
         Image($r('app.media.ic_close'))
         Image($r('app.media.ic_close'))
           .height(24).margin({ top: 20 }).onClick(() => {
           .height(24).margin({ top: 20 }).onClick(() => {
           this.controller.close()
           this.controller.close()
-          if (this.isOpen) {
-            this.isOpen = !this.isOpen
+          if (this.isOpenDetail) {
+            this.isOpenDetail = !this.isOpenDetail
           }
           }
         })
         })
       }.width('100%').justifyContent(FlexAlign.Center)
       }.width('100%').justifyContent(FlexAlign.Center)

 import { WDPlayerController } from 'wdPlayer/Index';
 import { WDPlayerController } from 'wdPlayer/Index';
 import { PlayerTitleView } from './PlayerTitleView'
 import { PlayerTitleView } from './PlayerTitleView'
+import { PlayerProgressView } from './PlayerProgressView'
+import { PlayerCommentView } from './PlayerCommentView'
 
 
 @Component
 @Component
 export struct PlayerBottomView {
 export struct PlayerBottomView {
+  @Consume showComment?: boolean
+  @Consume isOpenDetail?: boolean
   private playerController?: WDPlayerController;
   private playerController?: WDPlayerController;
 
 
   build() {
   build() {
     Column() {
     Column() {
       PlayerTitleView()
       PlayerTitleView()
+      PlayerProgressView({ playerController: this.playerController })
+        .visibility(this.isOpenDetail ? Visibility.None : Visibility.Visible)
+      if (this.showComment) {
+        PlayerCommentView().visibility(this.isOpenDetail ? Visibility.None : Visibility.Visible)
+      }
     }
     }
+    .alignItems(HorizontalAlign.Start)
     .position({ x: 0, y: '100%' })
     .position({ x: 0, y: '100%' })
-
-    // .markAnchor({ x: 56, y: 56 })
+    .markAnchor({ y: '100%' })
   }
   }
 }
 }

+import router from '@ohos.router';
+
+@Component
+export struct PlayerCommentView {
+  @Consume showComment?: boolean
+  @State comment: string = '';
+
+  build() {
+    Row() {
+      Image($r('app.media.ic_back'))
+        .width(24)
+        .height(24)
+        .aspectRatio(1)
+        .onClick(() => {
+          router.back();
+        })
+
+      TextInput({ placeholder: '说两句...', text: this.comment })
+        .placeholderColor(Color.White)
+        .placeholderFont({ size: 14 })
+        .fontColor(Color.White)
+        .fontSize(14)
+        .maxLines(1)
+        .layoutWeight(1)
+        .backgroundColor('#1a1a1a')
+        .borderRadius(2)
+        .height(30)
+        .margin({ left: 12 })
+    }
+    .backgroundColor(Color.Black)
+    .alignItems(VerticalAlign.Center)
+    .padding({ left: 16, right: 16, top: 11, bottom: 11 })
+  }
+}

+import { PlayerConstants, WDPlayerController } from 'wdPlayer/Index';
+
+@Component
+export struct PlayerProgressView {
+  private playerController?: WDPlayerController;
+  @Consume progressVal: number;
+  @State status: number = PlayerConstants.STATUS_START;
+
+  aboutToAppear() {
+    if (this.playerController) {
+      this.playerController.onStatusChange = (status: number) => {
+        this.status = status
+      }
+    }
+  }
+
+  build() {
+    Slider({
+      value: this.progressVal,
+      step: 0.01,
+      // style: SliderStyle.OutSet
+    })
+      .blockColor(this.status === PlayerConstants.STATUS_START ? Color.Transparent : $r('app.color.play_block_color'))
+      .trackColor(this.status === PlayerConstants.STATUS_START ? $r('app.color.play_track_color') : $r('app.color.pause_track_color'))
+      .selectedColor(this.status === PlayerConstants.STATUS_START ? $r('app.color.play_selected_color') : $r('app.color.pause_selected_color'))
+      .trackThickness(this.status === PlayerConstants.STATUS_START ? 1 : 4)
+      .blockStyle({
+        type: this.status === PlayerConstants.STATUS_START ? SliderBlockType.DEFAULT : SliderBlockType.IMAGE,
+        image: $r('app.media.ic_player_block')
+      })
+      .blockSize({ width: 18, height: 12 })
+      .width('100%')
+      .height(19)
+      .onChange((value: number, mode: SliderChangeMode) => {
+        this.playerController?.setSeekTime(Math.floor(value), mode);
+      })
+  }
+}

+import { ContentDetailDTO, InteractDataDTO, Params, RmhInfoDTO, UserInfoDTO } from 'wdBean/Index';
+import {
+  batchLikeAndCollectParams,
+  batchLikeAndCollectResult,
+  ContentDetailRequest,
+  contentListParams,
+  postExecuteCollectRecordParams,
+  postExecuteLikeParams,
+  postInteractAccentionOperateParams
+} from 'wdDetailPlayApi/src/main/ets/request/ContentDetailRequest';
+import { SPHelper, ToastUtils } from 'wdKit';
+import { HttpUrlUtils } from 'wdNetwork/Index';
+import { WDPlayerController } from 'wdPlayer/Index';
+import { WDRouterPage, WDRouterRule } from 'wdRouter/Index';
+import { SpConstants } from 'wdConstant/Index'
+
+export interface OperationItem {
+  icon: Resource;
+  icon_check?: Resource;
+
+  // icon_selected: Resource;
+  text: string | Resource;
+  num?: number; // 个数
+}
+
+const TAG = 'PlayerRightView';
+
 @Component
 @Component
 export struct PlayerRightView {
 export struct PlayerRightView {
+  private playerController?: WDPlayerController;
+  @Consume interactData: InteractDataDTO
+  @Consume contentDetailData: ContentDetailDTO
+  @Consume newsStatusOfUser: batchLikeAndCollectResult
+  @Consume followStatus: string
+  @Consume isOpenDetail: boolean
+  @State operationList: OperationItem[] = [
+    {
+      icon: $r('app.media.ic_like_uncheck'),
+      icon_check: $r('app.media.ic_like_check'),
+      text: "赞",
+      // num: 6622
+    },
+    {
+      icon: $r('app.media.ic_collect_uncheck'),
+      icon_check: $r('app.media.ic_collect_check'),
+      text: "收藏",
+      // num: 662,
+    },
+    {
+      icon: $r('app.media.ic_comment'),
+      text: "抢首评",
+      // num: 500,
+    },
+    {
+      icon: $r('app.media.ic_share'),
+      text: "分享"
+    }
+  ]
+
+  aboutToAppear() {
+  }
+
+  /**
+   * 点赞、取消点赞
+   */
+  async toggleLikeStatus() {
+    // 未登录，跳转登录
+    const user_id = await SPHelper.default.get(SpConstants.USER_ID, '')
+    if (!user_id) {
+      this.playerController?.pause()
+      WDRouterRule.jumpWithPage(WDRouterPage.loginPage)
+      return
+    }
+    const params: postExecuteLikeParams = {
+      status: this.newsStatusOfUser?.likeStatus === '1' ? '0' : '1',
+      contentId: this.contentDetailData?.newsId + '',
+      contentType: this.contentDetailData?.newsType + '',
+    }
+    ContentDetailRequest.postExecuteLike(params).then(res => {
+
+      if (this.newsStatusOfUser) {
+        this.newsStatusOfUser.likeStatus = this.newsStatusOfUser?.likeStatus === '1' ? '0' : '1'
+        if (this.newsStatusOfUser.likeStatus === '1') {
+          this.interactData.likeNum = Number(this.interactData.likeNum) + 1
+        } else {
+          this.interactData.likeNum = Number(this.interactData.likeNum) - 1
+        }
+        console.log('点赞、取消点赞==', this.newsStatusOfUser?.likeStatus, this.interactData?.likeNum)
+        // this.queryContentInteractCount()
+      }
+
+    })
+  }
+
+  /**
+   * 收藏、取消收藏
+   */
+  async toggleCollectStatus() {
+    // 未登录，跳转登录
+    const user_id = await SPHelper.default.get(SpConstants.USER_ID, '')
+    if (!user_id) {
+      WDRouterRule.jumpWithPage(WDRouterPage.loginPage)
+      return
+    }
+    const params: postExecuteCollectRecordParams = {
+      status: this.newsStatusOfUser?.collectStatus === 1 ? '0' : '1',
+      contentList: [{
+        contentId: this.contentDetailData?.newsId + '',
+        contentType: this.contentDetailData?.newsType + '',
+      }],
+
+    }
+    ContentDetailRequest.postExecuteCollectRecord(params).then(res => {
+      if (this.newsStatusOfUser) {
+        this.newsStatusOfUser.collectStatus = this.newsStatusOfUser?.collectStatus === 1 ? 0 : 1
+        // this.queryContentInteractCount()
+        if (this.newsStatusOfUser.collectStatus === 1) {
+          this.interactData.collectNum = Number(this.interactData.collectNum) + 1
+        } else {
+          this.interactData.collectNum = Number(this.interactData.collectNum) - 1
+        }
+        console.log('收藏、取消收藏==', this.newsStatusOfUser?.collectStatus, this.interactData?.collectNum)
+      }
+    })
+
+  }
+
+  /**
+   * 查询点赞、收藏数量
+   */
+  queryContentInteractCount() {
+    const params: contentListParams = {
+      contentList: [{
+        contentId: this.contentDetailData?.newsId + '',
+        contentType: this.contentDetailData?.newsType,
+      }]
+    }
+    ContentDetailRequest.getContentInteract(params).then(res => {
+      if (res.data && this.interactData) {
+        this.interactData.likeNum = res.data[0]?.likeNum
+        this.interactData.collectNum = res.data[0]?.collectNum
+        this.interactData.commentNum = res.data[0]?.commentNum
+      }
+      console.log('获取互动点赞等数据===', JSON.stringify(res))
+    })
+  }
+
+  getImgUrl() {
+    return this.contentDetailData?.rmhInfo?.rmhHeadUrl || this.contentDetailData?.userInfo?.userHeadUrl
+  }
+
+  /**
+   * 关注号主
+   */
+  async handleAccention() {
+    // 未登录，跳转登录
+    const user_id = await SPHelper.default.get(SpConstants.USER_ID, '')
+    if (!user_id) {
+      WDRouterRule.jumpWithPage(WDRouterPage.loginPage)
+      return
+    }
+
+    const params2: postInteractAccentionOperateParams = {
+      attentionUserType: this.contentDetailData?.rmhInfo?.userType || '', //被关注用户类型（1 普通用户 2 视频号 3 矩阵号）
+      attentionUserId: this.contentDetailData?.rmhInfo?.userId || '', // 被关注用户号主id
+      attentionCreatorId: this.contentDetailData?.rmhInfo?.rmhId || '', // 被关注用户号主id
+      // userType: 1,
+      // userId: '1',
+      status: 1,
+    }
+    ContentDetailRequest.postInteractAccentionOperate(params2).then(res => {
+      console.log('关注号主==', JSON.stringify(res.data))
+      if (this.followStatus == '1') {
+        this.followStatus = '0'
+      } else {
+        this.followStatus = '1'
+      }
+    })
+  }
+
+  @Builder
+  buildUserComp() {
+    Column() {
+      if (this.getImgUrl()) {
+        RelativeContainer() {
+          Image(this.getImgUrl())
+            .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")
+            .onClick(() => {
+              if (this.contentDetailData.rmhInfo?.cnMainControl === 1) {
+                // 号主页
+                const params: Params = {
+                  creatorId: this.contentDetailData.rmhInfo.rmhId,
+                  pageID: ''
+                }
+                WDRouterRule.jumpWithPage(WDRouterPage.peopleShipHomePage, params)
+              }
+
+            })
+          if (this.followStatus == '0') {
+            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")
+              .onClick(() => {
+                //    关注
+                this.handleAccention()
+              })
+          }
+
+        }.height(60)
+      }
+    }.margin({ bottom: 18 })
+  }
+
+  @Builder
+  buildOperationItem(item: OperationItem, index: number) {
+    Column() {
+      if (item.text === '赞') {
+        Image(this.newsStatusOfUser?.likeStatus == '1' ? item.icon_check : item.icon)
+          .width(32)
+          .aspectRatio(1)
+          .onClick(() => {
+            this.toggleLikeStatus()
+          })
+        Text(this.interactData?.likeNum ? (this.interactData.likeNum + '') : item.text)
+          .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown)
+          .fontWeight(500)
+          .textAlign(TextAlign.Center)
+          .fontSize(13)
+          .fontColor('#FFFFFF')
+          .maxLines(1)
+          .textOverflow({ overflow: TextOverflow.Ellipsis })
+      } else if (item.text === '收藏') {
+        Image(this.newsStatusOfUser?.collectStatus == 1 ? item.icon_check : item.icon)
+          .width(32)
+          .aspectRatio(1)
+          .onClick(() => {
+            this.toggleCollectStatus()
+          })
+        Text(this.interactData?.collectNum ? (this.interactData.collectNum + '') : item.text)
+          .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown)
+          .fontWeight(500)
+          .textAlign(TextAlign.Center)
+          .fontSize(13)
+          .fontColor('#FFFFFF')
+          .maxLines(1)
+          .textOverflow({ overflow: TextOverflow.Ellipsis })
+      } else if (item.text === '抢首评') {
+        Image(item.icon)
+          .width(32)
+          .aspectRatio(1)
+          .onClick((event: ClickEvent) => {
+            ToastUtils.showToast('评论为公共方法，待开发', 1000);
+          })
+        Text(this.interactData?.commentNum ? (this.interactData.commentNum + '') : item.text)
+          .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown)
+          .fontWeight(500)
+          .textAlign(TextAlign.Center)
+          .fontSize(13)
+          .fontColor('#FFFFFF')
+          .maxLines(1)
+          .textOverflow({ overflow: TextOverflow.Ellipsis })
+      } else {
+        Image(item.icon)
+          .width(32)
+          .aspectRatio(1)
+          .onClick((event: ClickEvent) => {
+            ToastUtils.showToast('分享为公共方法，待开发', 1000);
+          })
+        Text(item.text)
+          .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown)
+          .fontWeight(500)
+          .textAlign(TextAlign.Center)
+          .fontSize(13)
+          .fontColor('#FFFFFF')
+          .maxLines(1)
+          .textOverflow({ overflow: TextOverflow.Ellipsis })
+      }
+
+    }
+    // .width(48)
+    .margin({ bottom: 20 })
+    .alignItems(HorizontalAlign.Center)
+    .hoverEffect(HoverEffect.Scale)
+
+  }
+
   build() {
   build() {
+    Column() {
+      this.buildUserComp()
+      ForEach(this.operationList, (item: OperationItem, index: number) => {
+        this.buildOperationItem(item, index)
+      }, (item: OperationItem, index: number) => JSON.stringify(item))
+    }
+    .width(48)
+    .position({ x: '100%', y: '100%' })
+    .markAnchor({ x: '100%', y: '100%' })
+    .padding({ bottom: 72 })
+    .visibility(this.isOpenDetail ? Visibility.None : Visibility.Visible)
   }
   }
 }
 }

@@ -7,14 +7,15 @@ import { componentUtils } from '@kit.ArkUI'
 @Component
 @Component
 export struct PlayerTitleView {
 export struct PlayerTitleView {
   @Consume contentDetailData: ContentDetailDTO
   @Consume contentDetailData: ContentDetailDTO
-  @State isOpen: boolean = false
+  @Consume windowWidth: number
+  @Consume isOpenDetail: boolean
   @State titleHeight: number = 0
   @State titleHeight: number = 0
   dialogController: CustomDialogController = new CustomDialogController({
   dialogController: CustomDialogController = new CustomDialogController({
     builder: DetailDialog({
     builder: DetailDialog({
       name: this.getName(),
       name: this.getName(),
       title: this.getTitle(),
       title: this.getTitle(),
       summary: this.getSummary(),
       summary: this.getSummary(),
-      isOpen: this.isOpen
+      isOpenDetail: this.isOpenDetail
 
 
     }),
     }),
     autoCancel: false,
     autoCancel: false,
@@ -36,7 +37,7 @@ export struct PlayerTitleView {
   }
   }
 
 
   getSummary(): string {
   getSummary(): string {
-    return this.contentDetailData?.newsSummary || ''
+    return this.contentDetailData?.newIntroduction || ''
   }
   }
 
 
   aboutToAppear(): void {
   aboutToAppear(): void {
@@ -45,10 +46,11 @@ export struct PlayerTitleView {
       fontSize: 15,
       fontSize: 15,
       fontWeight: 400,
       fontWeight: 400,
       lineHeight: 20,
       lineHeight: 20,
-      constraintWidth: 287 - 16 - 22,
+      constraintWidth: this.windowWidth - 100 - 16 - 22 + 'px',
 
 
     })
     })
     this.titleHeight = info?.height as number || 0
     this.titleHeight = info?.height as number || 0
+    console.log('titleHeight:', this.titleHeight,)
   }
   }
 
 
   build() {
   build() {
@@ -82,7 +84,7 @@ export struct PlayerTitleView {
       /**
       /**
        * 标题大于三行或存在简介显示查看详情按钮
        * 标题大于三行或存在简介显示查看详情按钮
        */
        */
-      if (this.titleHeight > 180 || this.contentDetailData?.newsSummary) {
+      if (this.titleHeight > 200 || this.getSummary()) {
         Text('查看详情 > ')
         Text('查看详情 > ')
           .padding({ left: 6, right: 6, top: 4, bottom: 4 })
           .padding({ left: 6, right: 6, top: 4, bottom: 4 })
           .borderRadius(2)
           .borderRadius(2)
@@ -91,16 +93,17 @@ export struct PlayerTitleView {
           .fontSize(12)
           .fontSize(12)
           .lineHeight(14)
           .lineHeight(14)
           .fontWeight(400)
           .fontWeight(400)
+          .margin({ bottom: 8 })
           .onClick(() => {
           .onClick(() => {
-            this.isOpen = true
+            this.isOpenDetail = true
             this.dialogController?.open()
             this.dialogController?.open()
           })
           })
       }
       }
 
 
     }
     }
-    .backgroundColor(Color.Black)
-    .width(287)
+    .width(this.windowWidth - 100 + 'px')
     .padding({ left: 16, right: 22 })
     .padding({ left: 16, right: 22 })
     .alignItems(HorizontalAlign.Start)
     .alignItems(HorizontalAlign.Start)
+    .visibility(this.isOpenDetail ? Visibility.None : Visibility.Visible)
   }
   }
 }
 }

@@ -59,8 +59,12 @@ export default class EntryAbility extends UIAbility {
     const SYSTEM_AREA = windowClass.getWindowAvoidArea(TYPE_SYSTEM);
     const SYSTEM_AREA = windowClass.getWindowAvoidArea(TYPE_SYSTEM);
     const bottomSafeHeight = NAV_AREA.bottomRect.height; // 获取到导航条区域的高度
     const bottomSafeHeight = NAV_AREA.bottomRect.height; // 获取到导航条区域的高度
     const topSafeHeight = SYSTEM_AREA.topRect.height; // 获取到状态栏区域的高度
     const topSafeHeight = SYSTEM_AREA.topRect.height; // 获取到状态栏区域的高度
+    const width = windowClass.getWindowProperties().windowRect.width
+    const height = windowClass.getWindowProperties().windowRect.height
     AppStorage.setOrCreate('bottomSafeHeight', bottomSafeHeight);
     AppStorage.setOrCreate('bottomSafeHeight', bottomSafeHeight);
     AppStorage.setOrCreate('topSafeHeight', topSafeHeight);
     AppStorage.setOrCreate('topSafeHeight', topSafeHeight);
+    AppStorage.setOrCreate('windowWidth', width);
+    AppStorage.setOrCreate('windowHeight', height);
 
 
 
 
     // let a = new WindowModel();
     // let a = new WindowModel();