liyubing

feat:

1、直播详情页面 横屏  进入后台 暂停播放,回到页面恢复播放
@@ -7,10 +7,9 @@ import mediaquery from '@ohos.mediaquery'; @@ -7,10 +7,9 @@ import mediaquery from '@ohos.mediaquery';
7 import { Logger, WindowModel } from 'wdKit/Index'; 7 import { Logger, WindowModel } from 'wdKit/Index';
8 import { router, window } from '@kit.ArkUI'; 8 import { router, window } from '@kit.ArkUI';
9 import { WDAliPlayerController } from 'wdPlayer/Index'; 9 import { WDAliPlayerController } from 'wdPlayer/Index';
10 -import { LiveEmptyComponent, LiveOperRowListView } from 'wdComponent'; 10 +import { LiveOperRowListView } from 'wdComponent';
11 import { publishCommentModel } from 'wdComponent/src/main/ets/components/comment/model/PublishCommentModel'; 11 import { publishCommentModel } from 'wdComponent/src/main/ets/components/comment/model/PublishCommentModel';
12 import { TrackConstants, TrackingContent, TrackParamConvert } from 'wdTracking/Index'; 12 import { TrackConstants, TrackingContent, TrackParamConvert } from 'wdTracking/Index';
13 -import { LiveDetailPageLogic } from '../viewModel/LiveDetailPageLogic';  
14 13
15 let TAG: string = 'DetailPlayLivePage'; 14 let TAG: string = 'DetailPlayLivePage';
16 15
@@ -57,7 +56,6 @@ export struct DetailPlayLivePage { @@ -57,7 +56,6 @@ export struct DetailPlayLivePage {
57 this.getLiveDetails() 56 this.getLiveDetails()
58 this.getLiveRoomData() 57 this.getLiveRoomData()
59 58
60 - console.error(TAG, 'this.publishCommentModel', this.publishCommentModel.targetId)  
61 } 59 }
62 60
63 async aboutToDisappear() { 61 async aboutToDisappear() {
@@ -306,12 +306,13 @@ export struct PlayUIComponent { @@ -306,12 +306,13 @@ export struct PlayUIComponent {
306 .width(24) 306 .width(24)
307 .height(24) 307 .height(24)
308 .onClick(() => { 308 .onClick(() => {
  309 +
  310 + WindowModel.shared.setSpecificSystemBarEnabled(false)
  311 +
309 this.displayDirection = 312 this.displayDirection =
310 this.displayDirection == DisplayDirection.VERTICAL ? DisplayDirection.VIDEO_HORIZONTAL : 313 this.displayDirection == DisplayDirection.VERTICAL ? DisplayDirection.VIDEO_HORIZONTAL :
311 DisplayDirection.VERTICAL 314 DisplayDirection.VERTICAL
312 315
313 - WindowModel.shared.setSpecificSystemBarEnabled(false)  
314 -  
315 WindowModel.shared.setPreferredOrientation(this.displayDirection == DisplayDirection.VERTICAL ? 316 WindowModel.shared.setPreferredOrientation(this.displayDirection == DisplayDirection.VERTICAL ?
316 window.Orientation.PORTRAIT : 317 window.Orientation.PORTRAIT :
317 window.Orientation.LANDSCAPE_INVERTED) 318 window.Orientation.LANDSCAPE_INVERTED)
@@ -35,6 +35,17 @@ export struct TopPlayComponent { @@ -35,6 +35,17 @@ export struct TopPlayComponent {
35 private playUrl: string = "" 35 private playUrl: string = ""
36 private xComponentIsLoaded: boolean = false 36 private xComponentIsLoaded: boolean = false
37 @Consume liveDetailPageLogic: LiveDetailPageLogic 37 @Consume liveDetailPageLogic: LiveDetailPageLogic
  38 + @Consume @Watch('pageShowChange') pageShow: number
  39 + @Consume @Watch('pageHideChange') pageHide: number
  40 + init: boolean = false
  41 +
  42 + pageShowChange() {
  43 + this.playerController?.play()
  44 + }
  45 +
  46 + pageHideChange() {
  47 + this.playerController?.pause()
  48 + }
38 49
39 aboutToAppear(): void { 50 aboutToAppear(): void {
40 if (this.playerController) { 51 if (this.playerController) {
@@ -71,7 +82,7 @@ export struct TopPlayComponent { @@ -71,7 +82,7 @@ export struct TopPlayComponent {
71 updateData() { 82 updateData() {
72 83
73 // 检测垫片 84 // 检测垫片
74 - if (this.liveDetailPageLogic.showPad){ 85 + if (this.liveDetailPageLogic.showPad) {
75 this.isHideLoading = true 86 this.isHideLoading = true
76 this.isWait = true 87 this.isWait = true
77 this.previewUrl = this.liveDetailPageLogic.imgUrl 88 this.previewUrl = this.liveDetailPageLogic.imgUrl
@@ -43,22 +43,26 @@ export struct WDPlayerRenderLiveView { @@ -43,22 +43,26 @@ export struct WDPlayerRenderLiveView {
43 private playerController?: WDAliPlayerController; 43 private playerController?: WDAliPlayerController;
44 private xComponentController: XComponentController = new XComponentController(); 44 private xComponentController: XComponentController = new XComponentController();
45 onLoad?: ((event?: object) => void); 45 onLoad?: ((event?: object) => void);
46 - videoWidth: number = 0  
47 - videoHeight: number = 0 46 + @State videoWidth: number = 0
  47 + @State videoHeight: number = 0
  48 + @State videoRatio: number = 16 / 9
48 @State selfSize: Size = new Size('100%', '100%'); 49 @State selfSize: Size = new Size('100%', '100%');
49 private insId: string = "WDPlayerRenderLiveView" + insIndex; 50 private insId: string = "WDPlayerRenderLiveView" + insIndex;
50 51
  52 +
  53 +
51 aboutToAppear() { 54 aboutToAppear() {
52 MGPlayRenderViewIns.add(); 55 MGPlayRenderViewIns.add();
53 insIndex++; 56 insIndex++;
54 if (!this.playerController) { 57 if (!this.playerController) {
55 return 58 return
56 } 59 }
57 - 60 + //this.init = true
58 this.playerController.onVideoSizeChange = (width: number, height: number) => { 61 this.playerController.onVideoSizeChange = (width: number, height: number) => {
59 // console.log(`WDPlayerRenderView onVideoSizeChange width:${width} videoTop:${height}`) 62 // console.log(`WDPlayerRenderView onVideoSizeChange width:${width} videoTop:${height}`)
60 this.videoWidth = width; 63 this.videoWidth = width;
61 this.videoHeight = height; 64 this.videoHeight = height;
  65 + this.videoRatio = width / height
62 this.updateLayout() 66 this.updateLayout()
63 } 67 }
64 } 68 }
@@ -80,9 +84,9 @@ export struct WDPlayerRenderLiveView { @@ -80,9 +84,9 @@ export struct WDPlayerRenderLiveView {
80 .onLoad(async (event) => { 84 .onLoad(async (event) => {
81 Logger.info(TAG, 'onLoad') 85 Logger.info(TAG, 'onLoad')
82 let surfaceId = this.xComponentController.getXComponentSurfaceId() 86 let surfaceId = this.xComponentController.getXComponentSurfaceId()
83 - this.xComponentController.setXComponentSurfaceSize({  
84 - surfaceWidth: 1920,  
85 - surfaceHeight: 720 87 + this.xComponentController.setXComponentSurfaceRect({
  88 + surfaceWidth: this.videoWidth,
  89 + surfaceHeight: this.videoHeight
86 }); 90 });
87 if (enableAliPlayer) { 91 if (enableAliPlayer) {
88 this.playerController?.setSurfaceId(this.insId) 92 this.playerController?.setSurfaceId(this.insId)
@@ -93,8 +97,8 @@ export struct WDPlayerRenderLiveView { @@ -93,8 +97,8 @@ export struct WDPlayerRenderLiveView {
93 this.onLoad(event) 97 this.onLoad(event)
94 } 98 }
95 }) 99 })
96 - .width(this.selfSize.width)  
97 - .height(this.selfSize.height) 100 + // .width(this.selfSize.width)
  101 + // .height(this.selfSize.height)
98 } 102 }
99 .id(this.insId) 103 .id(this.insId)
100 .onAreaChange(() => { 104 .onAreaChange(() => {
@@ -107,15 +111,40 @@ export struct WDPlayerRenderLiveView { @@ -107,15 +111,40 @@ export struct WDPlayerRenderLiveView {
107 } 111 }
108 112
109 updateLayout() { 113 updateLayout() {
  114 +
110 let info = componentUtils.getRectangleById(this.insId); 115 let info = componentUtils.getRectangleById(this.insId);
111 - if (info.size.width > 0 && info.size.height > 0 && this.videoHeight > 0 && this.videoWidth > 0) {  
112 - if (info.size.width / info.size.height > this.videoWidth / this.videoHeight) {  
113 - let scale = info.size.height / this.videoHeight;  
114 - this.selfSize = new Size((this.videoWidth * scale / info.size.width) * 100 + "%", '100%');  
115 - } else {  
116 - let scale = info.size.width / this.videoWidth;  
117 - this.selfSize = new Size('100%', (this.videoHeight * scale / info.size.height) * 100 + "%"); 116 + Logger.debug(TAG, "播放器区域变化: " + JSON.stringify(info))
  117 +
  118 + Logger.debug(TAG, "xComponent rect: " + JSON.stringify(this.xComponentController.getXComponentSurfaceRect()))
  119 +
  120 + if (info.size.width > 0 && info.size.height > 0) {
  121 +
  122 + // 竖屏
  123 + if (this.videoHeight > 0 && this.videoWidth > 0 && this.videoWidth < this.videoHeight) {
  124 + let ratio = this.videoWidth / this.videoHeight
  125 + const height = info.size.width / ratio
  126 +
  127 + // 竖屏,缩放高度大于 视频区域高度
  128 + if (height > info.size.height) {
  129 +
  130 + Logger.debug(TAG, "ratio = " + ratio + " ==> new height = " + height)
  131 +
  132 + Logger.debug(TAG, "高度固定,求宽度: " + info.size.height * ratio)
  133 +
  134 + this.xComponentController.setXComponentSurfaceRect({
  135 + surfaceWidth: info.size.height * ratio,
  136 + surfaceHeight: info.size.height
  137 + });
  138 + return
  139 + }
118 } 140 }
  141 +
  142 + this.xComponentController.setXComponentSurfaceRect({
  143 + surfaceWidth: info.size.width,
  144 + surfaceHeight: info.size.height
  145 + });
119 } 146 }
120 } 147 }
  148 +
  149 +
121 } 150 }