developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
zhenghy
a1122c62 1 parent a3b68aca

视频沉浸式修改

Inline Side-by-side
Showing 7 changed files with 178 additions and 84 deletions
@@ -136,6 +136,10 @@ export class WindowModel { @@ -136,6 +136,10 @@ export class WindowModel {
136 this.windowClass?.setWindowSystemBarEnable(names) 136 this.windowClass?.setWindowSystemBarEnable(names)
137 } 137 }
138 138
  139 + getWindowProperties() {
  140 + return this.windowClass?.getWindowProperties()
  141 + }
  142 +
139 setWindowLayoutFullScreen(isFullScreen: boolean) { 143 setWindowLayoutFullScreen(isFullScreen: boolean) {
140 this.isFullScreen = isFullScreen 144 this.isFullScreen = isFullScreen
141 this.windowClass?.setWindowLayoutFullScreen(isFullScreen) 145 this.windowClass?.setWindowLayoutFullScreen(isFullScreen)
  1 +import { Action, LiveDetailsBean } from 'wdBean/Index';
  2 +import { LiveViewModel } from '../viewModel/LiveViewModel';
  3 +import router from '@ohos.router';
  4 +
  5 +import { DetailPlayLivePage } from './DetailPlayLivePage'
  6 +import { DetailPlayVLivePage } from './DetailPlayVLivePage'
  7 +
  8 +@Entry()
  9 +@Component
  10 +export struct DetailPlayLiveCommon {
  11 + TAG: string = 'DetailPlayLiveCommon';
  12 + private liveViewModel: LiveViewModel = new LiveViewModel()
  13 + @State liveDetailsBean: LiveDetailsBean = {} as LiveDetailsBean
  14 + @State liveState: string = ''
  15 + @State liveStyle: number = -1
  16 + @State relId: string = ''
  17 + @State contentId: string = ''
  18 + @State relType: string = ''
  19 +
  20 + aboutToAppear(): void {
  21 + //https://pdapis.pdnews.cn/api/rmrb-bff-display-zh/content/zh/c/content/detail?relId=500005302448&relType=1&contentId=20000016340
  22 + const par: Action = router.getParams() as Action;
  23 + const params = par?.params;
  24 + this.relId = params?.extra?.relId || '';
  25 + this.relType = params?.extra?.relType || '';
  26 + this.contentId = params?.contentID || '';
  27 + this.getLiveDetails()
  28 + }
  29 +
  30 + build() {
  31 + Column() {
  32 + if (this.liveState === 'wait' || this.liveStyle === 0) {
  33 + DetailPlayLivePage({ contentId: this.contentId, relId: this.relId, relType: this.relType })
  34 + } else if (this.liveStyle === 1) {
  35 + DetailPlayVLivePage({ contentId: this.contentId, relId: this.relId, relType: this.relType })
  36 + }
  37 + }
  38 + .height('100%')
  39 + .width('100%')
  40 + }
  41 +
  42 + getLiveDetails() {
  43 + this.liveViewModel.getLiveDetails(this.contentId, this.relId, this.relType)
  44 + .then(
  45 + (data) => {
  46 + if (data.length > 0) {
  47 + this.liveDetailsBean = data[0]
  48 + this.liveState = this.liveDetailsBean.liveInfo?.liveState
  49 + this.liveStyle = this.liveDetailsBean.liveInfo.liveStyle
  50 + console.error('liveDetailsBean===', JSON.stringify((this.liveDetailsBean)))
  51 + }
  52 + },
  53 + () => {
  54 +
  55 + })
  56 + }
  57 +}
  58 +
@@ -12,7 +12,7 @@ const storage = LocalStorage.getShared(); @@ -12,7 +12,7 @@ const storage = LocalStorage.getShared();
12 @Entry(storage) 12 @Entry(storage)
13 @Component 13 @Component
14 export struct DetailPlayVLivePage { 14 export struct DetailPlayVLivePage {
15 - TAG: string = 'DetailPlayLivePage'; 15 + TAG: string = 'DetailPlayVLivePage';
16 private liveViewModel: LiveViewModel = new LiveViewModel() 16 private liveViewModel: LiveViewModel = new LiveViewModel()
17 private playerController: WDPlayerController = new WDPlayerController(); 17 private playerController: WDPlayerController = new WDPlayerController();
18 private swiperController: SwiperController = new SwiperController() 18 private swiperController: SwiperController = new SwiperController()
@@ -10,13 +10,13 @@ export struct ChatItemComponent { @@ -10,13 +10,13 @@ export struct ChatItemComponent {
10 build() { 10 build() {
11 Row() { 11 Row() {
12 Text() { 12 Text() {
13 - if (this.item.senderUserName) {  
14 - Span(' 主持人 ')  
15 - .fontSize(11)  
16 - .lineHeight(20)  
17 - .textBackgroundStyle({ color: '#808562', radius: 2 })  
18 - Span(' ')  
19 - } 13 + // if (this.item.senderUserName) {
  14 + // Span(' 主持人 ')
  15 + // .fontSize(11)
  16 + // .lineHeight(20)
  17 + // .textBackgroundStyle({ color: '#808562', radius: 2 })
  18 + // Span(' ')
  19 + // }
20 Span(this.item.senderUserName + ': ') 20 Span(this.item.senderUserName + ': ')
21 .fontColor('#FFFFC63F') 21 .fontColor('#FFFFC63F')
22 .padding({ right: 118 }) 22 .padding({ right: 118 })
@@ -34,6 +34,9 @@ export struct DetailPlayShortVideoPage { @@ -34,6 +34,9 @@ export struct DetailPlayShortVideoPage {
34 @Provide followStatus: string = '0' // 关注状态 34 @Provide followStatus: string = '0' // 关注状态
35 @Link @Watch('switchVideoStatusChange') switchVideoStatus: boolean 35 @Link @Watch('switchVideoStatusChange') switchVideoStatus: boolean
36 36
  37 + /**
  38 + * 直播频道从其他频道切换回来需要继续播放视频
  39 + */
37 switchVideoStatusChange() { 40 switchVideoStatusChange() {
38 if (this.switchVideoStatus) { 41 if (this.switchVideoStatus) {
39 if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_PAUSE) { 42 if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_PAUSE) {
@@ -152,13 +155,9 @@ export struct DetailPlayShortVideoPage { @@ -152,13 +155,9 @@ export struct DetailPlayShortVideoPage {
152 console.log('aboutToDisappear', this.index) 155 console.log('aboutToDisappear', this.index)
153 this.playerController?.pause() 156 this.playerController?.pause()
154 this.playerController?.release(); 157 this.playerController?.release();
155 - // this.playerController.onCanplay = ()={}  
156 } 158 }
157 159
158 onPageHide() { 160 onPageHide() {
159 - // WindowModel.shared.setPreferredOrientation(window.Orientation.PORTRAIT);  
160 - // devicePLSensorManager.devicePLSensorOff();  
161 - // this.status = PlayerConstants.STATUS_PAUSE;  
162 this.playerController?.pause(); 161 this.playerController?.pause();
163 } 162 }
164 163
@@ -175,8 +174,8 @@ export struct DetailPlayShortVideoPage { @@ -175,8 +174,8 @@ export struct DetailPlayShortVideoPage {
175 }) 174 })
176 .height('100%') 175 .height('100%')
177 .width('100%') 176 .width('100%')
178 - .margin({ top: this.videoLandScape === 1 ? 218 : 0 })  
179 - .align(this.videoLandScape === 1 ? Alignment.Top : Alignment.Start) 177 + .margin({ bottom: this.videoLandScape === 1 ? 130 : 0 })
  178 + .align(this.videoLandScape === 0 ? Alignment.Top : Alignment.Center)
180 .onClick(() => { 179 .onClick(() => {
181 console.error('WDPlayerRenderView=== onClick') 180 console.error('WDPlayerRenderView=== onClick')
182 this.playerController?.switchPlayOrPause(); 181 this.playerController?.switchPlayOrPause();
@@ -209,7 +208,8 @@ export struct DetailPlayShortVideoPage { @@ -209,7 +208,8 @@ export struct DetailPlayShortVideoPage {
209 this.detailContainerBuilder() 208 this.detailContainerBuilder()
210 } 209 }
211 }) 210 })
212 - }.height('100%') 211 + }
  212 + .height('100%')
213 .width('100%') 213 .width('100%')
214 214
215 } 215 }
@@ -7,17 +7,16 @@ import { contentListParams } from 'wdDetailPlayApi/src/main/ets/request/ContentD @@ -7,17 +7,16 @@ import { contentListParams } from 'wdDetailPlayApi/src/main/ets/request/ContentD
7 import { WindowModel } from 'wdKit'; 7 import { WindowModel } from 'wdKit';
8 8
9 const storage = LocalStorage.getShared(); 9 const storage = LocalStorage.getShared();
  10 +const TAG = 'DetailVideoListPage'
10 11
11 @Entry(storage) 12 @Entry(storage)
12 @Component 13 @Component
13 export struct DetailVideoListPage { 14 export struct DetailVideoListPage {
14 - @Provide showComment: boolean = true  
15 - @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0  
16 - @State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0  
17 private contentId: string = '' 15 private contentId: string = ''
18 private relId: string = '' 16 private relId: string = ''
19 private relType: string = '' 17 private relType: string = ''
20 private swiperController: SwiperController = new SwiperController() 18 private swiperController: SwiperController = new SwiperController()
  19 + @Provide showComment: boolean = true
21 @State data: ContentDetailDTO[] = [] 20 @State data: ContentDetailDTO[] = []
22 @State testData: string[] = ['111', '222', '333'] 21 @State testData: string[] = ['111', '222', '333']
23 @State currentIndex: number = 0 22 @State currentIndex: number = 0
@@ -26,83 +25,74 @@ export struct DetailVideoListPage { @@ -26,83 +25,74 @@ export struct DetailVideoListPage {
26 @State switchVideoStatus: boolean = false 25 @State switchVideoStatus: boolean = false
27 26
28 async aboutToAppear(): Promise<void> { 27 async aboutToAppear(): Promise<void> {
  28 + this.openFullScreen()
29 29
30 - /**  
31 - * 开启沉浸式并设置状态栏颜色  
32 - */  
33 - // const windowStage = WindowModel.shared.getWindowStage() as window.WindowStage  
34 - // const windowClass: window.Window = windowStage.getMainWindowSync();  
35 - // windowClass.setWindowLayoutFullScreen(true)  
36 - // this.isFullScreen = true  
37 - // windowClass.setWindowSystemBarProperties({  
38 - // statusBarContentColor: '#ffffff',  
39 - // })  
40 -  
41 -  
42 - // let data: ContentDetailDTO[] = []  
43 - let action: Action = router.getParams() as Action 30 + const action: Action = router.getParams() as Action
44 if (action) { 31 if (action) {
45 this.contentId = action.params?.contentID || '' 32 this.contentId = action.params?.contentID || ''
46 if (action.params && action.params.extra) { 33 if (action.params && action.params.extra) {
47 this.relId = action.params.extra.relId || '' 34 this.relId = action.params.extra.relId || ''
48 this.relType = action.params.extra.relType || '' 35 this.relType = action.params.extra.relType || ''
49 } 36 }
50 - await ContentDetailRequest.getContentDetail({  
51 - contentId: this.contentId,  
52 - relId: this.relId,  
53 - relType: this.relType  
54 - }).then((resDTO: ResponseDTO<ContentDetailDTO[]>) => {  
55 - console.error('resDTO==', JSON.stringify(resDTO.data))  
56 - if (resDTO.data) {  
57 - this.data.push(resDTO.data[0])  
58 - }  
59 -  
60 - }) 37 + await this.getContentDetail(this.contentId, this.relId, this.relType)
61 } 38 }
62 39
63 await this.queryVideoList() 40 await this.queryVideoList()
  41 + this.getContentInteract()
64 42
  43 + console.log(TAG, 'aboutToAppear', JSON.stringify(action.params))
  44 + }
65 45
66 - if (this.data.length > 0) {  
67 - const params: contentListParams = {  
68 - contentList: []  
69 - }  
70 - this.data.map(item => {  
71 - params.contentList.push({  
72 - contentId: item.newsId + '',  
73 - contentType: item.newsType  
74 - })  
75 - })  
76 - // 批量查询内容当前用户点赞、收藏状态  
77 - await ContentDetailRequest.getContentInteract(params).then(res => {  
78 - if (res.data) {  
79 - this.interactDataList = res.data || []  
80 - }  
81 - console.log('获取互动点赞等数据===', JSON.stringify(res))  
82 - })  
83 - // 查询各类型内容动态数据接口V2 46 + aboutToDisappear(): void {
  47 + console.log(TAG, 'aboutToDisappear')
  48 + this.closeFullScreen()
  49 + }
84 50
85 - } 51 + onPageShow(): void {
  52 + console.log(TAG, 'onPageShow')
  53 + this.openFullScreen()
86 54
87 - // this.data = data  
88 - console.error('aboutToAppear===', this.data.length) 55 + console.log('getWindowProperties', JSON.stringify(WindowModel.shared.getWindowProperties()))
89 56
90 57
91 } 58 }
92 59
93 - aboutToDisappear(): void {  
94 - WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', })  
95 - WindowModel.shared.setWindowLayoutFullScreen(false) 60 + onPageHide(): void {
  61 + console.log(TAG, 'onPageHide')
  62 + this.closeFullScreen()
96 } 63 }
97 64
98 - onPageShow(): void { 65 + /**
  66 + * 开启沉浸式
  67 + * TODO:颜色待根据业务接口修改
  68 + */
  69 + openFullScreen() {
99 WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', }) 70 WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', })
100 - WindowModel.shared.setWindowLayoutFullScreen(true) 71 + // WindowModel.shared.setWindowLayoutFullScreen(true)
  72 + // WindowModel.shared.setWindowSystemBarEnable([])
101 } 73 }
102 74
103 - onPageHide(): void { 75 + /**
  76 + * 关闭沉浸式
  77 + * TODO:颜色待根据业务接口修改
  78 + */
  79 + closeFullScreen() {
104 WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', }) 80 WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', })
105 - WindowModel.shared.setWindowLayoutFullScreen(false) 81 + // WindowModel.shared.setWindowLayoutFullScreen(false)
  82 + // WindowModel.shared.setWindowSystemBarEnable(['status', 'navigation'])
  83 + }
  84 +
  85 + async getContentDetail(contentId: string, relId: string, relType: string) {
  86 + await ContentDetailRequest.getContentDetail({
  87 + contentId: contentId,
  88 + relId: relId,
  89 + relType: relType
  90 + }).then((resDTO: ResponseDTO<ContentDetailDTO[]>) => {
  91 + console.error('getContentDetail==', JSON.stringify(resDTO.data))
  92 + if (resDTO.data) {
  93 + this.data.push(resDTO.data[0])
  94 + }
  95 + })
106 } 96 }
107 97
108 /** 98 /**
@@ -116,14 +106,36 @@ export struct DetailVideoListPage { @@ -116,14 +106,36 @@ export struct DetailVideoListPage {
116 if (res.data) { 106 if (res.data) {
117 this.data = this.data.concat(res.data) 107 this.data = this.data.concat(res.data)
118 } 108 }
119 - // console.log('queryVideoList===', JSON.stringify(this.data))  
120 }) 109 })
121 } 110 }
122 111
  112 + /**
  113 + * 批量查询内容当前用户点赞、收藏状态
  114 + */
  115 + getContentInteract() {
  116 + if (this.data.length > 0) {
  117 + const params: contentListParams = {
  118 + contentList: []
  119 + }
  120 + this.data.map(item => {
  121 + params.contentList.push({
  122 + contentId: item.newsId + '',
  123 + contentType: item.newsType
  124 + })
  125 + })
  126 + // 批量查询内容当前用户点赞、收藏状态
  127 + ContentDetailRequest.getContentInteract(params).then(res => {
  128 + if (res.data) {
  129 + this.interactDataList = res.data || []
  130 + }
  131 + console.log('获取互动点赞等数据===', JSON.stringify(res))
  132 + })
  133 + }
  134 + }
  135 +
123 build() { 136 build() {
124 Column() { 137 Column() {
125 Swiper(this.swiperController) { 138 Swiper(this.swiperController) {
126 -  
127 ForEach(this.data, (item: ContentDetailDTO, index: number) => { 139 ForEach(this.data, (item: ContentDetailDTO, index: number) => {
128 Column() { 140 Column() {
129 DetailPlayShortVideoPage({ 141 DetailPlayShortVideoPage({
@@ -153,6 +165,10 @@ export struct DetailVideoListPage { @@ -153,6 +165,10 @@ export struct DetailVideoListPage {
153 this.queryVideoList() 165 this.queryVideoList()
154 } 166 }
155 }) 167 })
156 - }.width('100%').height('100%').backgroundColor(Color.Black).padding({ bottom: this.bottomSafeHeight + 'px' }) 168 + }
  169 + .width('100%')
  170 + .height('100%')
  171 + .backgroundColor(Color.Black)
  172 + .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM, SafeAreaEdge.START, SafeAreaEdge.END])
157 } 173 }
158 } 174 }
@@ -71,29 +71,45 @@ export struct VideoChannelDetail { @@ -71,29 +71,45 @@ export struct VideoChannelDetail {
71 } 71 }
72 72
73 aboutToAppear() { 73 aboutToAppear() {
74 - WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', statusBarColor: '#000000' })  
75 - // WindowModel.shared.setWindowLayoutFullScreen(true) 74 + this.openFullScreen()
76 // 根据视频频道传参查询视频楼层信息 75 // 根据视频频道传参查询视频楼层信息
77 this.getRecCompInfo() 76 this.getRecCompInfo()
78 Logger.info(TAG, 'aboutToAppear'); 77 Logger.info(TAG, 'aboutToAppear');
79 } 78 }
80 79
81 aboutToDisappear(): void { 80 aboutToDisappear(): void {
82 - WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', statusBarColor: '#ffffff' })  
83 - // WindowModel.shared.setWindowLayoutFullScreen(false) 81 + this.closeFullScreen()
84 Logger.info(TAG, 'aboutToDisappear'); 82 Logger.info(TAG, 'aboutToDisappear');
85 } 83 }
86 84
87 - onPageShow(): void {  
88 - WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', statusBarColor: '#000000' }) 85 + // onPageShow(): void {
  86 + // this.openFullScreen()
  87 + // Logger.info(TAG, 'onPageShow');
  88 + // }
  89 + //
  90 + // onPageHide(): void {
  91 + // this.closeFullScreen()
  92 + // Logger.info(TAG, 'onPageHide');
  93 + // }
  94 +
  95 + /**
  96 + * 开启沉浸式
  97 + * TODO:颜色待根据业务接口修改
  98 + */
  99 + openFullScreen() {
  100 + WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', })
89 // WindowModel.shared.setWindowLayoutFullScreen(true) 101 // WindowModel.shared.setWindowLayoutFullScreen(true)
90 - Logger.info(TAG, 'onPageShow'); 102 + // WindowModel.shared.setWindowSystemBarEnable([])
91 } 103 }
92 104
93 - onPageHide(): void {  
94 - WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', statusBarColor: '#ffffff' }) 105 + /**
  106 + * 关闭沉浸式
  107 + * TODO:颜色待根据业务接口修改
  108 + */
  109 + closeFullScreen() {
  110 + WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', })
95 // WindowModel.shared.setWindowLayoutFullScreen(false) 111 // WindowModel.shared.setWindowLayoutFullScreen(false)
96 - Logger.info(TAG, 'onPageHide'); 112 + // WindowModel.shared.setWindowSystemBarEnable(['status', 'navigation'])
97 } 113 }
98 114
99 /** 115 /**