zhenghy

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

@@ -3,11 +3,14 @@ export interface RmhInfoDTO { @@ -3,11 +3,14 @@ export interface RmhInfoDTO {
3 authTitle: string; 3 authTitle: string;
4 authTitle2: string; 4 authTitle2: string;
5 banControl: number; 5 banControl: number;
6 - cnIsAttention: number; 6 + cnIsAttention?: number;
  7 + cnAttention?: number;
  8 + cnlsComment?: number;
  9 + cnlsLike?: number;
7 cnMainControl: number; 10 cnMainControl: number;
8 cnShareControl: number; 11 cnShareControl: number;
9 - cnIsComment: number;  
10 - cnIsLike: number; 12 + cnIsComment?: number;
  13 + cnIsLike?: number;
11 posterShareControl: number; 14 posterShareControl: number;
12 rmhDesc: string; 15 rmhDesc: string;
13 rmhHeadUrl: string; 16 rmhHeadUrl: string;
@@ -91,6 +91,7 @@ export struct BottomNavigationComponent { @@ -91,6 +91,7 @@ export struct BottomNavigationComponent {
91 // this.onBottomNavigationIndexChange() 91 // this.onBottomNavigationIndexChange()
92 }) 92 })
93 .backgroundColor(this.barBackgroundColor) 93 .backgroundColor(this.barBackgroundColor)
  94 + .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
94 95
95 // .padding({ bottom: this.bottomRectHeight + 'px', top: this.topRectHeight + 'px' }) // 此处margin具体数值在实际中应与导航条区域高度保持一致 96 // .padding({ bottom: this.bottomRectHeight + 'px', top: this.topRectHeight + 'px' }) // 此处margin具体数值在实际中应与导航条区域高度保持一致
96 97
@@ -32,20 +32,20 @@ export struct DetailPlayShortVideoPage { @@ -32,20 +32,20 @@ export struct DetailPlayShortVideoPage {
32 @Provide videoLandScape?: number = 1; // 视频朝向, 横屏视频:1;竖屏视频:2 32 @Provide videoLandScape?: number = 1; // 视频朝向, 横屏视频:1;竖屏视频:2
33 @Provide newsStatusOfUser: batchLikeAndCollectResult | undefined = undefined // 点赞、收藏状态 33 @Provide newsStatusOfUser: batchLikeAndCollectResult | undefined = undefined // 点赞、收藏状态
34 @Provide followStatus: string = '0' // 关注状态 34 @Provide followStatus: string = '0' // 关注状态
35 - @Link @Watch('switchVideoStatusChange') switchVideoStatus: boolean  
36 -  
37 - /**  
38 - * 直播频道从其他频道切换回来需要继续播放视频  
39 - */  
40 - switchVideoStatusChange() {  
41 - if (this.switchVideoStatus) {  
42 - if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_PAUSE) {  
43 - this.playerController.play()  
44 - }  
45 - } else {  
46 - if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_START) {  
47 - this.playerController.pause()  
48 - } 35 + @Consume @Watch('pageShowChange') pageShow: number
  36 + @Consume @Watch('pageHideChange') pageHide: number
  37 +
  38 + pageShowChange() {
  39 + if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_PAUSE) {
  40 + this.playerController.play()
  41 + this.queryNewsInfoOfUser()
  42 + }
  43 + }
  44 +
  45 + pageHideChange() {
  46 + if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_START) {
  47 + this.playerController.pause()
  48 +
49 } 49 }
50 } 50 }
51 51
@@ -68,9 +68,7 @@ export struct DetailPlayShortVideoPage { @@ -68,9 +68,7 @@ export struct DetailPlayShortVideoPage {
68 } 68 }
69 } 69 }
70 70
71 - /**  
72 - * 查询用户点赞、收藏、关注等状态  
73 - */ 71 + // 查询用户点赞、收藏、关注等状态
74 queryNewsInfoOfUser() { 72 queryNewsInfoOfUser() {
75 if (HttpUrlUtils.getUserId()) { 73 if (HttpUrlUtils.getUserId()) {
76 const params: batchLikeAndCollectParams = { 74 const params: batchLikeAndCollectParams = {
@@ -118,46 +116,32 @@ export struct DetailPlayShortVideoPage { @@ -118,46 +116,32 @@ export struct DetailPlayShortVideoPage {
118 } 116 }
119 117
120 aboutToAppear() { 118 aboutToAppear() {
121 - // console.log('开始设置setContentDetailData', JSON.stringify(this.contentDetailData))  
122 this.videoLandScape = this.contentDetailData?.videoInfo[0]?.videoLandScape 119 this.videoLandScape = this.contentDetailData?.videoInfo[0]?.videoLandScape
123 - this.queryNewsInfoOfUser()  
124 this.playerController.onCanplay = () => { 120 this.playerController.onCanplay = () => {
125 if (this.index == 0 || this.currentIndex === this.index) { 121 if (this.index == 0 || this.currentIndex === this.index) {
126 this.playerController.play() 122 this.playerController.play()
127 } 123 }
128 } 124 }
129 -  
130 this.playerController.onTimeUpdate = (position, duration) => { 125 this.playerController.onTimeUpdate = (position, duration) => {
131 this.progressVal = Math.floor(position * 100 / duration); 126 this.progressVal = Math.floor(position * 100 / duration);
132 } 127 }
133 -  
134 - // 设置播放地址  
135 - let listener = mediaquery.matchMediaSync('(orientation: landscape)');  
136 - listener.on("change", (mediaQueryResult) => {  
137 - if (mediaQueryResult.matches) {  
138 - console.log("横屏 yes")  
139 - this.isFullScreen = true  
140 - } else {  
141 - this.isFullScreen = false  
142 - console.log("横屏 no")  
143 - }  
144 - // WindowModel.shared.setMainWindowFullScreen(this.isFullScreen)  
145 - })  
146 -  
147 - }  
148 -  
149 - onPageShow() {  
150 - // this.playerController?.play();  
151 - // WindowModel.shared.setPreferredOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED); 128 + this.queryNewsInfoOfUser()
152 } 129 }
153 130
154 aboutToDisappear(): void { 131 aboutToDisappear(): void {
155 - console.log('aboutToDisappear', this.index) 132 + console.log(TAG, 'aboutToDisappear', this.index)
156 this.playerController?.pause() 133 this.playerController?.pause()
157 this.playerController?.release(); 134 this.playerController?.release();
158 } 135 }
159 136
  137 + onPageShow() {
  138 + console.log(TAG, 'onPageShow')
  139 + this.queryNewsInfoOfUser()
  140 + // this.playerController?.play();
  141 + }
  142 +
160 onPageHide() { 143 onPageHide() {
  144 + console.log(TAG, 'onPageHide')
161 this.playerController?.pause(); 145 this.playerController?.pause();
162 } 146 }
163 147
@@ -16,7 +16,11 @@ export struct DetailVideoListPage { @@ -16,7 +16,11 @@ export struct DetailVideoListPage {
16 private relId: string = '' 16 private relId: string = ''
17 private relType: string = '' 17 private relType: string = ''
18 private swiperController: SwiperController = new SwiperController() 18 private swiperController: SwiperController = new SwiperController()
  19 + @Provide bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
  20 + @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
19 @Provide showComment: boolean = true 21 @Provide showComment: boolean = true
  22 + @Provide pageShow: number = -1
  23 + @Provide pageHide: number = -1
20 @State data: ContentDetailDTO[] = [] 24 @State data: ContentDetailDTO[] = []
21 @State testData: string[] = ['111', '222', '333'] 25 @State testData: string[] = ['111', '222', '333']
22 @State currentIndex: number = 0 26 @State currentIndex: number = 0
@@ -48,17 +52,17 @@ export struct DetailVideoListPage { @@ -48,17 +52,17 @@ export struct DetailVideoListPage {
48 this.closeFullScreen() 52 this.closeFullScreen()
49 } 53 }
50 54
  55 + // page show/hide只能在外层组件触发
51 onPageShow(): void { 56 onPageShow(): void {
52 console.log(TAG, 'onPageShow') 57 console.log(TAG, 'onPageShow')
  58 + this.pageShow = Math.random()
53 this.openFullScreen() 59 this.openFullScreen()
54 60
55 - console.log('getWindowProperties', JSON.stringify(WindowModel.shared.getWindowProperties()))  
56 -  
57 -  
58 } 61 }
59 62
60 onPageHide(): void { 63 onPageHide(): void {
61 console.log(TAG, 'onPageHide') 64 console.log(TAG, 'onPageHide')
  65 + this.pageHide = Math.random()
62 this.closeFullScreen() 66 this.closeFullScreen()
63 } 67 }
64 68
@@ -68,7 +72,7 @@ export struct DetailVideoListPage { @@ -68,7 +72,7 @@ export struct DetailVideoListPage {
68 */ 72 */
69 openFullScreen() { 73 openFullScreen() {
70 WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', }) 74 WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', })
71 - // WindowModel.shared.setWindowLayoutFullScreen(true) 75 + WindowModel.shared.setWindowLayoutFullScreen(true)
72 // WindowModel.shared.setWindowSystemBarEnable([]) 76 // WindowModel.shared.setWindowSystemBarEnable([])
73 } 77 }
74 78
@@ -78,7 +82,7 @@ export struct DetailVideoListPage { @@ -78,7 +82,7 @@ export struct DetailVideoListPage {
78 */ 82 */
79 closeFullScreen() { 83 closeFullScreen() {
80 WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', }) 84 WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', })
81 - // WindowModel.shared.setWindowLayoutFullScreen(false) 85 + WindowModel.shared.setWindowLayoutFullScreen(false)
82 // WindowModel.shared.setWindowSystemBarEnable(['status', 'navigation']) 86 // WindowModel.shared.setWindowSystemBarEnable(['status', 'navigation'])
83 } 87 }
84 88
@@ -105,6 +109,7 @@ export struct DetailVideoListPage { @@ -105,6 +109,7 @@ export struct DetailVideoListPage {
105 }).then(res => { 109 }).then(res => {
106 if (res.data) { 110 if (res.data) {
107 this.data = this.data.concat(res.data) 111 this.data = this.data.concat(res.data)
  112 + console.log('视频列表===', JSON.stringify(res.data))
108 } 113 }
109 }) 114 })
110 } 115 }
@@ -138,7 +143,6 @@ export struct DetailVideoListPage { @@ -138,7 +143,6 @@ export struct DetailVideoListPage {
138 Swiper(this.swiperController) { 143 Swiper(this.swiperController) {
139 ForEach(this.data, (item: ContentDetailDTO, index: number) => { 144 ForEach(this.data, (item: ContentDetailDTO, index: number) => {
140 DetailPlayShortVideoPage({ 145 DetailPlayShortVideoPage({
141 - switchVideoStatus: $switchVideoStatus,  
142 contentDetailData: item, 146 contentDetailData: item,
143 currentIndex: this.currentIndex, 147 currentIndex: this.currentIndex,
144 index: index, 148 index: index,
@@ -155,9 +159,8 @@ export struct DetailVideoListPage { @@ -155,9 +159,8 @@ export struct DetailVideoListPage {
155 .displayCount(1, true) 159 .displayCount(1, true)
156 .onChange((index: number) => { 160 .onChange((index: number) => {
157 this.currentIndex = index 161 this.currentIndex = index
158 - console.info('onChange==', index.toString())  
159 -  
160 if (this.currentIndex === this.data.length - 1) { 162 if (this.currentIndex === this.data.length - 1) {
  163 + // TODO:下拉刷新“努力加载中”
161 this.queryVideoList() 164 this.queryVideoList()
162 } 165 }
163 }) 166 })
@@ -165,6 +168,9 @@ export struct DetailVideoListPage { @@ -165,6 +168,9 @@ export struct DetailVideoListPage {
165 .width('100%') 168 .width('100%')
166 .height('100%') 169 .height('100%')
167 .backgroundColor(Color.Black) 170 .backgroundColor(Color.Black)
168 - .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM, SafeAreaEdge.START, SafeAreaEdge.END]) 171 + .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
  172 + .padding({
  173 + bottom: this.bottomSafeHeight + 'px'
  174 + })
169 } 175 }
170 } 176 }
@@ -2,35 +2,11 @@ @@ -2,35 +2,11 @@
2 @Component 2 @Component
3 export struct Test { 3 export struct Test {
4 build() { 4 build() {
5 - Row() {  
6 -  
7 - RelativeContainer() {  
8 - Image($r('app.media.ic_like_uncheck'))  
9 - .width('100%')  
10 - .borderRadius(24)  
11 - .aspectRatio(1)  
12 - .border({ width: 1, color: Color.White, style: BorderStyle.Solid })  
13 - .alignRules({  
14 - top: { anchor: "__container__", align: VerticalAlign.Top },  
15 - left: { anchor: "__container__", align: HorizontalAlign.Start }  
16 - })  
17 - .id("row1")  
18 -  
19 - Image($r('app.media.ic_add'))  
20 - .width(24)  
21 - .borderRadius(12)  
22 - .alignRules({  
23 - left: { anchor: "__container__", align: HorizontalAlign.Center },  
24 - bottom: { anchor: "__container__", align: VerticalAlign.Bottom },  
25 - })  
26 - .margin({ left: -12 })  
27 - .id("row2")  
28 - }.height('auto')  
29 -  
30 - }  
31 - .height(58)  
32 - .width(48)  
33 - .backgroundColor(Color.Black)  
34 - 5 + Column() {
  6 + Row() {
  7 + Text('111')
  8 + }
  9 + }.width('100%')
  10 + .backgroundColor('#cccccc')
35 } 11 }
36 } 12 }
@@ -216,7 +216,6 @@ export struct VideoChannelDetail { @@ -216,7 +216,6 @@ export struct VideoChannelDetail {
216 ForEach(this.data, (item: ContentDetailDTO, index: number) => { 216 ForEach(this.data, (item: ContentDetailDTO, index: number) => {
217 Column() { 217 Column() {
218 DetailPlayShortVideoPage({ 218 DetailPlayShortVideoPage({
219 - switchVideoStatus: $switchVideoStatus,  
220 contentDetailData: item, 219 contentDetailData: item,
221 currentIndex: this.currentIndex, 220 currentIndex: this.currentIndex,
222 index: index, 221 index: index,
  1 +@Preview
1 @CustomDialog 2 @CustomDialog
2 export struct DetailDialog { 3 export struct DetailDialog {
3 controller: CustomDialogController 4 controller: CustomDialogController
@@ -8,8 +9,8 @@ export struct DetailDialog { @@ -8,8 +9,8 @@ export struct DetailDialog {
8 9
9 build() { 10 build() {
10 Column() { 11 Column() {
11 - if (this.name + '1222222') {  
12 - Text(`@${this.name}` + '1222222') 12 + if (this.name) {
  13 + Text(`@${this.name}`)
13 .fontColor(Color.White) 14 .fontColor(Color.White)
14 .fontSize(14) 15 .fontSize(14)
15 .fontWeight(600) 16 .fontWeight(600)
  1 +import { WDPlayerController } from 'wdPlayer/Index';
  2 +import { PlayerTitleView } from './PlayerTitleView'
  3 +
  4 +@Component
  5 +export struct PlayerBottomView {
  6 + private playerController?: WDPlayerController;
  7 +
  8 + build() {
  9 + Column() {
  10 + PlayerTitleView()
  11 + }
  12 + .position({ x: 0, y: '100%' })
  13 +
  14 + // .markAnchor({ x: 56, y: 56 })
  15 + }
  16 +}
@@ -14,51 +14,6 @@ export struct PlayerDetailContainer { @@ -14,51 +14,6 @@ export struct PlayerDetailContainer {
14 console.log(`PlayerDetailContainer aboutToAppear`) 14 console.log(`PlayerDetailContainer aboutToAppear`)
15 } 15 }
16 16
17 - buildVideoHeight() {  
18 - let videoHeight: string | number = 200  
19 - if (this.videoLandScape == 2) {  
20 - videoHeight = '100%'  
21 - } else {  
22 - videoHeight = 200  
23 - }  
24 - console.log(`PlayerDetailContainer buildVideoHeight:${videoHeight} `)  
25 - return videoHeight  
26 - }  
27 -  
28 - buildVideoTo() {  
29 - let videoTop: number;  
30 - if (this.videoLandScape == 2) {  
31 - videoTop = 0  
32 - } else {  
33 - videoTop = 174  
34 - }  
35 - console.log(`PlayerDetailContainer videoTop:${videoTop} `)  
36 - return videoTop  
37 - }  
38 -  
39 - buildVideoBottom() {  
40 - let videoBottom: number;  
41 - if (this.videoLandScape == 2) {  
42 - videoBottom = 0  
43 - } else {  
44 - videoBottom = 320  
45 - }  
46 - console.log(`PlayerDetailContainer buildVideoBottom:${videoBottom} `)  
47 - return videoBottom  
48 - }  
49 -  
50 - isShowBottomView() {  
51 - console.log(`PlayerDetailContainer videoLandScape:${this.videoLandScape} `)  
52 - let isShowBottom: boolean = false  
53 - if (this.isFullScreen) {  
54 - isShowBottom = false  
55 - } else {  
56 - isShowBottom = true  
57 - }  
58 - console.log(`PlayerDetailContainer isShowBottom:${isShowBottom} `)  
59 - return isShowBottom  
60 - }  
61 -  
62 build() { 17 build() {
63 Stack() { 18 Stack() {
64 this.playerView() 19 this.playerView()
  1 +@Component
  2 +export struct PlayerRightView {
  3 + build() {
  4 + }
  5 +}
@@ -49,8 +49,14 @@ export struct PlayerTitleComment { @@ -49,8 +49,14 @@ export struct PlayerTitleComment {
49 49
50 getName() { 50 getName() {
51 // console.error(this.contentDetailData?.newsSourceName + '===========' + this.contentDetailData?.editorName) 51 // console.error(this.contentDetailData?.newsSourceName + '===========' + this.contentDetailData?.editorName)
  52 + // this.contentDetailData?.newsSourceName || authTitle
  53 + return this.contentDetailData?.rmhInfo?.rmhName || ''
  54 + }
  55 +
  56 + getIcon() {
  57 + // console.error(this.contentDetailData?.newsSourceName + '===========' + this.contentDetailData?.editorName)
52 // this.contentDetailData?.newsSourceName || 58 // this.contentDetailData?.newsSourceName ||
53 - return this.contentDetailData?.editorName || '' 59 + return this.contentDetailData?.rmhInfo?.authIcon || ''
54 } 60 }
55 61
56 getTitle() { 62 getTitle() {
@@ -99,11 +105,16 @@ export struct PlayerTitleComment { @@ -99,11 +105,16 @@ export struct PlayerTitleComment {
99 Row() { 105 Row() {
100 Column() { 106 Column() {
101 if (this.getName()) { 107 if (this.getName()) {
102 - Text("@" + this.getName())  
103 - .fontColor(Color.White)  
104 - .fontSize(15)  
105 - .maxLines(1)  
106 - .textOverflow({ overflow: TextOverflow.Ellipsis }) 108 + Row() {
  109 + Text("@" + this.getName())
  110 + .fontColor(Color.White)
  111 + .fontSize(15)
  112 + .maxLines(1)
  113 + .textOverflow({ overflow: TextOverflow.Ellipsis })
  114 + if (this.getIcon()) {
  115 + Image(this.getIcon()).height(10).margin({ left: 4 })
  116 + }
  117 + }
107 } 118 }
108 if (this.getTitle()) { 119 if (this.getTitle()) {
109 Text(this.getTitle()) 120 Text(this.getTitle())
  1 +import measure from '@ohos.measure'
  2 +import { ContentDetailDTO } from 'wdBean/Index'
  3 +import { DetailDialog } from './DetailDialog'
  4 +import { componentUtils } from '@kit.ArkUI'
  5 +
  6 +@Preview
  7 +@Component
  8 +export struct PlayerTitleView {
  9 + @Consume contentDetailData: ContentDetailDTO
  10 + @State isOpen: boolean = false
  11 + @State titleHeight: number = 0
  12 + dialogController: CustomDialogController = new CustomDialogController({
  13 + builder: DetailDialog({
  14 + name: this.getName(),
  15 + title: this.getTitle(),
  16 + summary: this.getSummary(),
  17 + isOpen: this.isOpen
  18 +
  19 + }),
  20 + autoCancel: false,
  21 + customStyle: true,
  22 + alignment: DialogAlignment.Bottom
  23 + })
  24 +
  25 + getName(): string {
  26 + // authTitle
  27 + return this.contentDetailData?.rmhInfo?.rmhName || ''
  28 + }
  29 +
  30 + getIcon(): string {
  31 + return this.contentDetailData?.rmhInfo?.authIcon || ''
  32 + }
  33 +
  34 + getTitle(): string {
  35 + return this.contentDetailData?.newsTitle || ''
  36 + }
  37 +
  38 + getSummary(): string {
  39 + return this.contentDetailData?.newsSummary || ''
  40 + }
  41 +
  42 + aboutToAppear(): void {
  43 + const info = measure.measureTextSize({
  44 + textContent: this.getTitle(),
  45 + fontSize: 15,
  46 + fontWeight: 400,
  47 + lineHeight: 20,
  48 + constraintWidth: 287 - 16 - 22,
  49 +
  50 + })
  51 + this.titleHeight = info?.height as number || 0
  52 + }
  53 +
  54 + build() {
  55 + Column() {
  56 + if (this.getName()) {
  57 + Row() {
  58 + Text("@" + this.getName())
  59 + .fontColor(Color.White)
  60 + .fontSize(17)
  61 + .maxLines(1)
  62 + .lineHeight(25)
  63 + .fontWeight(600)
  64 + .textOverflow({ overflow: TextOverflow.Ellipsis })
  65 +
  66 + if (this.getIcon()) {
  67 + Image(this.getIcon()).height(10).margin({ left: 4 })
  68 + }
  69 + }.margin({ bottom: 8 })
  70 +
  71 + }
  72 +
  73 + Text(this.getTitle())
  74 + .fontColor(Color.White)
  75 + .fontSize(15)
  76 + .maxLines(3)
  77 + .lineHeight(20)
  78 + .fontWeight(400)
  79 + .textOverflow({ overflow: TextOverflow.Ellipsis })
  80 + .margin({ bottom: 8 })
  81 +
  82 + /**
  83 + * 标题大于三行或存在简介显示查看详情按钮
  84 + */
  85 + if (this.titleHeight > 180 || this.contentDetailData?.newsSummary) {
  86 + Text('查看详情 > ')
  87 + .padding({ left: 6, right: 6, top: 4, bottom: 4 })
  88 + .borderRadius(2)
  89 + .backgroundColor('#99636363')
  90 + .fontColor(Color.White)
  91 + .fontSize(12)
  92 + .lineHeight(14)
  93 + .fontWeight(400)
  94 + .onClick(() => {
  95 + this.isOpen = true
  96 + this.dialogController?.open()
  97 + })
  98 + }
  99 +
  100 + }
  101 + .backgroundColor(Color.Black)
  102 + .width(287)
  103 + .padding({ left: 16, right: 22 })
  104 + .alignItems(HorizontalAlign.Start)
  105 + }
  106 +}
@@ -73,13 +73,12 @@ export struct WDPlayerRenderView { @@ -73,13 +73,12 @@ export struct WDPlayerRenderView {
73 Row() { 73 Row() {
74 // 设置为“surface“类型时XComponent组件可以和其他组件一起进行布局和渲染。 74 // 设置为“surface“类型时XComponent组件可以和其他组件一起进行布局和渲染。
75 XComponent({ 75 XComponent({
76 - id: 'xComponentId',  
77 - type: 'surface', 76 + id: this.insId,
  77 + type: XComponentType.SURFACE,
78 controller: this.xComponentController 78 controller: this.xComponentController
79 }) 79 })
80 .onLoad(async (event) => { 80 .onLoad(async (event) => {
81 Logger.info(TAG, 'onLoad') 81 Logger.info(TAG, 'onLoad')
82 - // const surfaceId = this.xComponentController.getXComponentSurfaceId()  
83 this.xComponentController.setXComponentSurfaceSize({ 82 this.xComponentController.setXComponentSurfaceSize({
84 surfaceWidth: 1920, 83 surfaceWidth: 1920,
85 surfaceHeight: 1080 84 surfaceHeight: 1080
@@ -89,13 +88,16 @@ export struct WDPlayerRenderView { @@ -89,13 +88,16 @@ export struct WDPlayerRenderView {
89 this.onLoad(event) 88 this.onLoad(event)
90 } 89 }
91 }) 90 })
92 - .width(this.selfSize.width)  
93 - .height(this.selfSize.height) 91 + .width('100%')// .width(this.selfSize.width)
  92 + // .height(this.selfSize.height)
  93 + .aspectRatio(this.videoWidth / this.videoHeight)
  94 + .renderFit(RenderFit.RESIZE_COVER)
94 } 95 }
95 - .id(this.insId)  
96 - .onAreaChange(() => {  
97 - // this.updateLayout()  
98 - }) 96 +
  97 + // .onAreaChange(() => {
  98 + // this.updateLayout()
  99 + // })
  100 +
99 .backgroundColor("#000000") 101 .backgroundColor("#000000")
100 102
101 // .height('100%') 103 // .height('100%')
@@ -103,15 +105,21 @@ export struct WDPlayerRenderView { @@ -103,15 +105,21 @@ export struct WDPlayerRenderView {
103 } 105 }
104 106
105 updateLayout() { 107 updateLayout() {
106 - let info = componentUtils.getRectangleById(this.insId);  
107 - if (info.size.width > 0 && info.size.height > 0 && this.videoHeight > 0 && this.videoWidth > 0) {  
108 - if (info.size.width / info.size.height > this.videoWidth / this.videoHeight) {  
109 - let scale = info.size.height / this.videoHeight;  
110 - this.selfSize = new Size((this.videoWidth * scale / info.size.width) * 100 + "%", '100%');  
111 - } else {  
112 - let scale = info.size.width / this.videoWidth;  
113 - this.selfSize = new Size('100%', (this.videoHeight * scale / info.size.height) * 100 + "%"); 108 + // let info = componentUtils.getRectangleById(this.insId);
  109 + const windowRect = WindowModel.shared.getWindowProperties()?.windowRect
  110 + if (windowRect) {
  111 + const info = windowRect
  112 + if (info.width > 0 && info.height > 0 && this.videoHeight > 0 && this.videoWidth > 0) {
  113 + if (info.width / info.height > this.videoWidth / this.videoHeight) {
  114 + let scale = info.height / this.videoHeight;
  115 + this.selfSize = new Size((this.videoWidth * scale / info.width) * 100 + "%", '100%');
  116 + } else {
  117 + let scale = info.width / this.videoWidth;
  118 + this.selfSize = new Size('100%', (this.videoHeight * scale / info.height) * 100 + "%");
  119 + }
114 } 120 }
115 } 121 }
  122 +
  123 +
116 } 124 }
117 } 125 }
1 -import { BottomNavigationComponent, LogoutViewModel} from 'wdComponent'; 1 +import { BottomNavigationComponent, LogoutViewModel } from 'wdComponent';
2 import { BreakpointConstants } from 'wdConstant'; 2 import { BreakpointConstants } from 'wdConstant';
3 3
4 -import { BreakpointSystem, EmitterEventId, EmitterUtils, Logger } from 'wdKit'; 4 +import { BreakpointSystem, EmitterEventId, EmitterUtils, Logger } from 'wdKit';
5 import router from '@ohos.router'; 5 import router from '@ohos.router';
6 import { promptAction } from '@kit.ArkUI'; 6 import { promptAction } from '@kit.ArkUI';
7 import { HWLocationUtils } from 'wdHwAbility/Index'; 7 import { HWLocationUtils } from 'wdHwAbility/Index';
@@ -12,7 +12,8 @@ const TAG = 'MainPage'; @@ -12,7 +12,8 @@ const TAG = 'MainPage';
12 @Entry 12 @Entry
13 @Component 13 @Component
14 struct MainPage { 14 struct MainPage {
15 - 15 + @Provide pageShow: number = -1
  16 + @Provide pageHide: number = -1
16 private breakpointSystem: BreakpointSystem = new BreakpointSystem() 17 private breakpointSystem: BreakpointSystem = new BreakpointSystem()
17 @StorageLink('currentBreakpoint') @Watch('watchCurrentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_XS; 18 @StorageLink('currentBreakpoint') @Watch('watchCurrentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_XS;
18 19
@@ -34,9 +35,14 @@ struct MainPage { @@ -34,9 +35,14 @@ struct MainPage {
34 Logger.info(TAG, 'aboutToDisappear'); 35 Logger.info(TAG, 'aboutToDisappear');
35 } 36 }
36 37
37 -  
38 onPageHide() { 38 onPageHide() {
39 Logger.info(TAG, 'onPageHide'); 39 Logger.info(TAG, 'onPageHide');
  40 + this.pageHide = Math.random()
  41 + }
  42 +
  43 + onPageShow() {
  44 + Logger.info(TAG, 'onPageShow');
  45 + this.pageShow = Math.random()
40 } 46 }
41 47
42 onBackPress() { 48 onBackPress() {