developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
zhenghy
495817fc 1 parent ed6469fd

播放器修改

Inline Side-by-side
Showing 11 changed files with 301 additions and 177 deletions
  1 +/**
  2 + * https://developer.huawei.com/consumer/cn/doc/harmonyos-references/js-apis-window-0000001820880785#ZH-CN_TOPIC_0000001811317218__systembarproperties
  3 + * 状态栏、导航栏的属性。
  4 + */
  5 +
  6 +/**
  7 + * 状态栏背景颜色 statusBarColor
  8 + * 导航栏背景颜色 navigationBarColor
  9 + */
  10 +export const enum SysStatusBarColor {
  11 + WHITE = '#ffffff',
  12 + BLACK = '#000000',
  13 + DEFAULT = '#0x66000000'
  14 +}
  15 +
  16 +
  17 +/**
  18 + * 状态栏文字颜色 statusBarContentColor8
  19 + * 导航栏文字颜色 navigationBarContentColor8
  20 + */
  21 +export const enum SysBarContentColor {
  22 + WHITE = '#ffffff',
  23 + BLACK = '#000000',
  24 + DEFAULT = '0xE5FFFFFF'
  25 +}
  26 +
  27 +
  28 +
1 -  
2 import { Logger, DateTimeUtils, CollectionUtils } from 'wdKit'; 1 import { Logger, DateTimeUtils, CollectionUtils } from 'wdKit';
3 import { CommonConstants, CompStyle, ViewType } from 'wdConstant'; 2 import { CommonConstants, CompStyle, ViewType } from 'wdConstant';
4 import PageViewModel from '../../viewmodel/PageViewModel'; 3 import PageViewModel from '../../viewmodel/PageViewModel';
@@ -14,7 +13,7 @@ import CustomRefreshLoadLayout from './CustomRefreshLoadLayout'; @@ -14,7 +13,7 @@ import CustomRefreshLoadLayout from './CustomRefreshLoadLayout';
14 import { CompParser } from '../CompParser'; 13 import { CompParser } from '../CompParser';
15 import { GroupInfoDTO } from 'wdBean/src/main/ets/bean/navigation/PageInfoDTO'; 14 import { GroupInfoDTO } from 'wdBean/src/main/ets/bean/navigation/PageInfoDTO';
16 import { VideoChannelDetail } from 'wdDetailPlayShortVideo/Index'; 15 import { VideoChannelDetail } from 'wdDetailPlayShortVideo/Index';
17 -import { CompDTO, LiveReviewDTO, PageDTO ,PageInfoDTO} from 'wdBean'; 16 +import { CompDTO, LiveReviewDTO, PageDTO, PageInfoDTO } from 'wdBean';
18 17
19 18
20 const TAG = 'PageComponent'; 19 const TAG = 'PageComponent';
@@ -72,39 +71,44 @@ export struct PageComponent { @@ -72,39 +71,44 @@ export struct PageComponent {
72 @Builder 71 @Builder
73 ListLayout() { 72 ListLayout() {
74 List() { 73 List() {
75 - // 下拉刷新  
76 - ListItem() {  
77 - RefreshLayout({  
78 - refreshBean: new RefreshLayoutBean(this.pageModel.isVisiblePullDown, this.pageModel.pullDownRefreshImage,  
79 - this.pageModel.pullDownRefreshText, this.pageModel.pullDownRefreshHeight)  
80 - }) 74 + if (this.name !== '视频') {
  75 + // 下拉刷新
  76 + ListItem() {
  77 + RefreshLayout({
  78 + refreshBean: new RefreshLayoutBean(this.pageModel.isVisiblePullDown, this.pageModel.pullDownRefreshImage,
  79 + this.pageModel.pullDownRefreshText, this.pageModel.pullDownRefreshHeight)
  80 + })
  81 + }
81 } 82 }
82 83
83 - LazyForEach(this.pageModel.compList, (compDTO: CompDTO, compIndex: number) => {  
84 - ListItem() {  
85 - Column() {  
86 - if (this.name == '视频') {  
87 - VideoChannelDetail()  
88 - } else { 84 + if (this.name == '视频') {
  85 + VideoChannelDetail()
  86 + } else {
  87 + LazyForEach(this.pageModel.compList, (compDTO: CompDTO, compIndex: number) => {
  88 + ListItem() {
  89 + Column() {
89 CompParser({ compDTO: compDTO, compIndex: compIndex }); 90 CompParser({ compDTO: compDTO, compIndex: compIndex });
  91 +
90 } 92 }
  93 + }
  94 + },
  95 + (compDTO: CompDTO, compIndex: number) => compDTO.id + compIndex.toString() + this.pageModel.timestamp
  96 + )
  97 + }
91 98
  99 +
  100 + if (this.name !== '视频') {
  101 + // 加载更多
  102 + ListItem() {
  103 + if (this.pageModel.hasMore) {
  104 + LoadMoreLayout({
  105 + refreshBean: new RefreshLayoutBean(this.pageModel.isVisiblePullUpLoad, this.pageModel.pullUpLoadImage,
  106 + this.pageModel.pullUpLoadText, this.pageModel.pullUpLoadHeight)
  107 + })
  108 + } else {
  109 + NoMoreLayout()
92 } 110 }
93 } 111 }
94 - },  
95 - (compDTO: CompDTO, compIndex: number) => compDTO.id + compIndex.toString() + this.pageModel.timestamp  
96 - )  
97 -  
98 - // 加载更多  
99 - ListItem() {  
100 - if (this.pageModel.hasMore) {  
101 - LoadMoreLayout({  
102 - refreshBean: new RefreshLayoutBean(this.pageModel.isVisiblePullUpLoad, this.pageModel.pullUpLoadImage,  
103 - this.pageModel.pullUpLoadText, this.pageModel.pullUpLoadHeight)  
104 - })  
105 - } else {  
106 - NoMoreLayout()  
107 - }  
108 } 112 }
109 } 113 }
110 .scrollBar(BarState.Off) 114 .scrollBar(BarState.Off)
@@ -165,30 +169,30 @@ export struct PageComponent { @@ -165,30 +169,30 @@ export struct PageComponent {
165 } 169 }
166 // pageInfo.groups.forEach(async (group) => { 不能按顺序加载用for...of替代 170 // pageInfo.groups.forEach(async (group) => { 不能按顺序加载用for...of替代
167 // for (const group of pageInfo.groups) { 171 // for (const group of pageInfo.groups) {
168 - this.pageDto = await PageViewModel.getPageData(this.pageModel, getContext(this))  
169 - this.pageModel.timestamp = DateTimeUtils.getTimeStamp().toString()  
170 - if (this.pageDto && this.pageDto.compList && this.pageDto.compList.length > 0) {  
171 - this.pageDto.compList.forEach((comp) => {  
172 - if (comp.compStyle === CompStyle.Zh_Grid_Layout_02 && this.liveReviewDTO && this.liveReviewDTO.list && this.liveReviewDTO.list.length > 0) {  
173 - comp.operDataList.push(...this.liveReviewDTO.list)  
174 - }  
175 - })  
176 -  
177 - this.pageModel.viewType = ViewType.LOADED;  
178 - this.pageModel.compList.push(...this.pageDto.compList)  
179 - if (this.pageDto.compList.length === this.pageModel.pageSize) {  
180 - this.pageModel.currentPage++;  
181 - this.pageModel.hasMore = true;  
182 - } else {  
183 - this.pageModel.hasMore = false; 172 + this.pageDto = await PageViewModel.getPageData(this.pageModel, getContext(this))
  173 + this.pageModel.timestamp = DateTimeUtils.getTimeStamp().toString()
  174 + if (this.pageDto && this.pageDto.compList && this.pageDto.compList.length > 0) {
  175 + this.pageDto.compList.forEach((comp) => {
  176 + if (comp.compStyle === CompStyle.Zh_Grid_Layout_02 && this.liveReviewDTO && this.liveReviewDTO.list && this.liveReviewDTO.list.length > 0) {
  177 + comp.operDataList.push(...this.liveReviewDTO.list)
184 } 178 }
185 - // 二次请求，批查互动数据  
186 - PageViewModel.getInteractData(this.pageDto.compList).then((data: CompDTO[]) => {  
187 - // 刷新，替换所有数据  
188 - this.pageModel.compList.replaceAll(...data)  
189 - this.pageModel.timestamp = DateTimeUtils.getTimeStamp().toString()  
190 - })  
191 - this.isFirstIn = false 179 + })
  180 +
  181 + this.pageModel.viewType = ViewType.LOADED;
  182 + this.pageModel.compList.push(...this.pageDto.compList)
  183 + if (this.pageDto.compList.length === this.pageModel.pageSize) {
  184 + this.pageModel.currentPage++;
  185 + this.pageModel.hasMore = true;
  186 + } else {
  187 + this.pageModel.hasMore = false;
  188 + }
  189 + // 二次请求，批查互动数据
  190 + PageViewModel.getInteractData(this.pageDto.compList).then((data: CompDTO[]) => {
  191 + // 刷新，替换所有数据
  192 + this.pageModel.compList.replaceAll(...data)
  193 + this.pageModel.timestamp = DateTimeUtils.getTimeStamp().toString()
  194 + })
  195 + this.isFirstIn = false
192 // } else { 196 // } else {
193 // Logger.debug(TAG, 'aboutToAppear, data response page ' + this.pageId + ', comp list is empty.'); 197 // Logger.debug(TAG, 'aboutToAppear, data response page ' + this.pageId + ', comp list is empty.');
194 // this.pageModel.viewType = ViewType.EMPTY; 198 // this.pageModel.viewType = ViewType.EMPTY;
@@ -43,13 +43,9 @@ export struct DetailPlayShortVideoPage { @@ -43,13 +43,9 @@ export struct DetailPlayShortVideoPage {
43 43
44 } else { 44 } else {
45 this.queryNewsInfoOfUser() 45 this.queryNewsInfoOfUser()
46 - console.log('currentIndex==== ', this.currentIndex)  
47 if (!this.playerController.getPlayer()) { 46 if (!this.playerController.getPlayer()) {
48 - console.error('state91111111===', this.contentDetailData?.videoInfo[0]?.videoUrl || '')  
49 this.playerController.firstPlay(this.contentDetailData?.videoInfo[0]?.videoUrl || ''); 47 this.playerController.firstPlay(this.contentDetailData?.videoInfo[0]?.videoUrl || '');
50 - console.error('state91111111===', this.playerController?.getPlayer()?.state)  
51 } else { 48 } else {
52 - console.error('state9===', this.playerController?.getPlayer()?.state)  
53 this.playerController.play() 49 this.playerController.play()
54 } 50 }
55 51
@@ -135,6 +131,7 @@ export struct DetailPlayShortVideoPage { @@ -135,6 +131,7 @@ export struct DetailPlayShortVideoPage {
135 } 131 }
136 132
137 onPageShow() { 133 onPageShow() {
  134 + // this.playerController?.play();
138 // WindowModel.shared.setPreferredOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED); 135 // WindowModel.shared.setPreferredOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED);
139 } 136 }
140 137
@@ -147,7 +144,7 @@ export struct DetailPlayShortVideoPage { @@ -147,7 +144,7 @@ export struct DetailPlayShortVideoPage {
147 144
148 onPageHide() { 145 onPageHide() {
149 // WindowModel.shared.setPreferredOrientation(window.Orientation.PORTRAIT); 146 // WindowModel.shared.setPreferredOrientation(window.Orientation.PORTRAIT);
150 - devicePLSensorManager.devicePLSensorOff(); 147 + // devicePLSensorManager.devicePLSensorOff();
151 // this.status = PlayerConstants.STATUS_PAUSE; 148 // this.status = PlayerConstants.STATUS_PAUSE;
152 this.playerController?.pause(); 149 this.playerController?.pause();
153 } 150 }
@@ -12,6 +12,7 @@ const storage = LocalStorage.getShared(); @@ -12,6 +12,7 @@ const storage = LocalStorage.getShared();
12 @Entry(storage) 12 @Entry(storage)
13 @Component 13 @Component
14 export struct DetailVideoListPage { 14 export struct DetailVideoListPage {
  15 + @Provide showComment: boolean = true
15 @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0 16 @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
16 @State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0 17 @State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
17 private contentId: string = '' 18 private contentId: string = ''
@@ -22,14 +23,20 @@ export struct DetailVideoListPage { @@ -22,14 +23,20 @@ export struct DetailVideoListPage {
22 @State testData: string[] = ['111', '222', '333'] 23 @State testData: string[] = ['111', '222', '333']
23 @State currentIndex: number = 0 24 @State currentIndex: number = 0
24 @State interactDataList: InteractDataDTO[] = [] 25 @State interactDataList: InteractDataDTO[] = []
  26 + @State isFullScreen: boolean = false
25 27
26 async aboutToAppear(): Promise<void> { 28 async aboutToAppear(): Promise<void> {
27 29
28 - 30 + /**
  31 + * 开启沉浸式并设置状态栏颜色
  32 + */
29 const windowStage = WindowModel.shared.getWindowStage() as window.WindowStage 33 const windowStage = WindowModel.shared.getWindowStage() as window.WindowStage
30 - const windowClass: window.Window = windowStage.getMainWindowSync(); // 获取应用主窗口 34 + const windowClass: window.Window = windowStage.getMainWindowSync();
31 windowClass.setWindowLayoutFullScreen(true) 35 windowClass.setWindowLayoutFullScreen(true)
32 - windowClass.setWindowSystemBarProperties({ statusBarColor: '#fff' }) 36 + this.isFullScreen = true
  37 + windowClass.setWindowSystemBarProperties({
  38 + statusBarContentColor: '#ffffff',
  39 + })
33 40
34 41
35 let data: ContentDetailDTO[] = [] 42 let data: ContentDetailDTO[] = []
@@ -99,7 +106,32 @@ export struct DetailVideoListPage { @@ -99,7 +106,32 @@ export struct DetailVideoListPage {
99 const windowStage = WindowModel.shared.getWindowStage() as window.WindowStage 106 const windowStage = WindowModel.shared.getWindowStage() as window.WindowStage
100 const windowClass: window.Window = windowStage.getMainWindowSync(); // 获取应用主窗口 107 const windowClass: window.Window = windowStage.getMainWindowSync(); // 获取应用主窗口
101 windowClass.setWindowLayoutFullScreen(false) 108 windowClass.setWindowLayoutFullScreen(false)
102 - windowClass.setWindowSystemBarProperties({ statusBarColor: '#000' }) 109 + this.isFullScreen = false
  110 + windowClass.setWindowSystemBarProperties({ statusBarContentColor: '#000000' })
  111 +
  112 + }
  113 +
  114 + onPageShow(): void {
  115 + if (!this.isFullScreen) {
  116 + const windowStage = WindowModel.shared.getWindowStage() as window.WindowStage
  117 + const windowClass: window.Window = windowStage.getMainWindowSync();
  118 + windowClass.setWindowLayoutFullScreen(true)
  119 + this.isFullScreen = true
  120 + windowClass.setWindowSystemBarProperties({
  121 + statusBarContentColor: '#ffffff',
  122 + })
  123 +
  124 + }
  125 + }
  126 +
  127 + onPageHide(): void {
  128 + if (this.isFullScreen) {
  129 + const windowStage = WindowModel.shared.getWindowStage() as window.WindowStage
  130 + const windowClass: window.Window = windowStage.getMainWindowSync(); // 获取应用主窗口
  131 + windowClass.setWindowLayoutFullScreen(false)
  132 + this.isFullScreen = false
  133 + windowClass.setWindowSystemBarProperties({ statusBarContentColor: '#000000' })
  134 + }
103 135
104 } 136 }
105 137
@@ -14,8 +14,8 @@ export struct VideoChannelDetail { @@ -14,8 +14,8 @@ export struct VideoChannelDetail {
14 private relId: string = '' 14 private relId: string = ''
15 private relType: string = '' 15 private relType: string = ''
16 private swiperController: SwiperController = new SwiperController() 16 private swiperController: SwiperController = new SwiperController()
  17 + @Provide showComment: boolean = false
17 @State data: ContentDetailDTO[] = [] 18 @State data: ContentDetailDTO[] = []
18 - @State testData: string[] = ['111', '222', '333']  
19 @State currentIndex: number = 0 19 @State currentIndex: number = 0
20 @State interactDataList: InteractDataDTO[] = [] 20 @State interactDataList: InteractDataDTO[] = []
21 21
@@ -93,7 +93,7 @@ export struct VideoChannelDetail { @@ -93,7 +93,7 @@ export struct VideoChannelDetail {
93 if (res.data) { 93 if (res.data) {
94 this.data = this.data.concat(res.data) 94 this.data = this.data.concat(res.data)
95 } 95 }
96 - // console.log('queryVideoList===', JSON.stringify(this.data)) 96 + console.log('queryVideoList===', JSON.stringify(this.data))
97 }) 97 })
98 } 98 }
99 99
@@ -10,6 +10,7 @@ import { @@ -10,6 +10,7 @@ import {
10 } from 'wdDetailPlayApi/src/main/ets/request/ContentDetailRequest'; 10 } from 'wdDetailPlayApi/src/main/ets/request/ContentDetailRequest';
11 import { ToastUtils } from 'wdKit'; 11 import { ToastUtils } from 'wdKit';
12 import { HttpUrlUtils } from 'wdNetwork/Index'; 12 import { HttpUrlUtils } from 'wdNetwork/Index';
  13 +import { WDPlayerController } from 'wdPlayer/Index';
13 import { WDRouterPage, WDRouterRule } from 'wdRouter/Index'; 14 import { WDRouterPage, WDRouterRule } from 'wdRouter/Index';
14 15
15 export interface OperationItem { 16 export interface OperationItem {
@@ -28,6 +29,7 @@ const TAG = 'OperationListView'; @@ -28,6 +29,7 @@ const TAG = 'OperationListView';
28 @Preview 29 @Preview
29 @Component 30 @Component
30 export struct OperationListView { 31 export struct OperationListView {
  32 + private playerController?: WDPlayerController;
31 @Consume interactData: InteractDataDTO 33 @Consume interactData: InteractDataDTO
32 @Consume contentDetailData: ContentDetailDTO 34 @Consume contentDetailData: ContentDetailDTO
33 @Consume newsStatusOfUser: batchLikeAndCollectResult 35 @Consume newsStatusOfUser: batchLikeAndCollectResult
@@ -65,6 +67,7 @@ export struct OperationListView { @@ -65,6 +67,7 @@ export struct OperationListView {
65 toggleLikeStatus() { 67 toggleLikeStatus() {
66 // 未登录，跳转登录 68 // 未登录，跳转登录
67 if (!HttpUrlUtils.getUserId()) { 69 if (!HttpUrlUtils.getUserId()) {
  70 + this.playerController?.pause()
68 WDRouterRule.jumpWithPage(WDRouterPage.loginPage) 71 WDRouterRule.jumpWithPage(WDRouterPage.loginPage)
69 return 72 return
70 } 73 }
@@ -2,7 +2,7 @@ import router from '@ohos.router'; @@ -2,7 +2,7 @@ import router from '@ohos.router';
2 import window from '@ohos.window'; 2 import window from '@ohos.window';
3 import deviceInfo from '@ohos.deviceInfo'; 3 import deviceInfo from '@ohos.deviceInfo';
4 import { WindowModel } from 'wdKit'; 4 import { WindowModel } from 'wdKit';
5 -import { WDPlayerController } from 'wdPlayer'; 5 +import { PlayerConstants, WDPlayerController } from 'wdPlayer';
6 import { devicePLSensorManager } from 'wdDetailPlayApi'; 6 import { devicePLSensorManager } from 'wdDetailPlayApi';
7 import { OperationListView } from './OperationListView'; 7 import { OperationListView } from './OperationListView';
8 import { ContentDetailDTO, RmhInfoDTO, UserInfoDTO } from 'wdBean/Index'; 8 import { ContentDetailDTO, RmhInfoDTO, UserInfoDTO } from 'wdBean/Index';
@@ -17,7 +17,9 @@ export struct PlayerTitleComment { @@ -17,7 +17,9 @@ export struct PlayerTitleComment {
17 @Consume isFullScreen: boolean; 17 @Consume isFullScreen: boolean;
18 @Consume progressVal: number; 18 @Consume progressVal: number;
19 @Consume videoLandScape?: number 19 @Consume videoLandScape?: number
  20 + @Consume showComment?: boolean
20 @State isOpen: boolean = false 21 @State isOpen: boolean = false
  22 + @State status: number = PlayerConstants.STATUS_START;
21 dialogController: CustomDialogController = new CustomDialogController({ 23 dialogController: CustomDialogController = new CustomDialogController({
22 builder: DetailDialog({ 24 builder: DetailDialog({
23 name: this.getName(), 25 name: this.getName(),
@@ -32,6 +34,12 @@ export struct PlayerTitleComment { @@ -32,6 +34,12 @@ export struct PlayerTitleComment {
32 }) 34 })
33 35
34 aboutToAppear() { 36 aboutToAppear() {
  37 + if (this.playerController) {
  38 + this.playerController.onStatusChange = (status: number) => {
  39 + this.status = status
  40 + }
  41 +
  42 + }
35 43
36 } 44 }
37 45
@@ -54,35 +62,36 @@ export struct PlayerTitleComment { @@ -54,35 +62,36 @@ export struct PlayerTitleComment {
54 build() { 62 build() {
55 Column() { 63 Column() {
56 64
57 - if (this.contentDetailData?.videoInfo[0]?.videoLandScape === 1) {  
58 - Column() {  
59 - Row() {  
60 - Image($r('app.media.ic_switch_orientation'))  
61 - .width(34)  
62 - .aspectRatio(1)  
63 - .objectFit(ImageFit.Contain)  
64 - .padding({ left: 10, right: 5 })  
65 - Text("全屏观看")  
66 - .fontColor(Color.White)  
67 - .fontSize('14fp')  
68 - .maxLines(2)  
69 - .layoutWeight(1)  
70 - }  
71 - .width(100)  
72 - .backgroundColor(Color.Gray)  
73 - .borderRadius(10)  
74 - .alignItems(VerticalAlign.Center)  
75 - .visibility(this.videoLandScape == 2 ? Visibility.Hidden : Visibility.Visible)  
76 - .onClick(() => {  
77 - this.isFullScreen = !this.isFullScreen;  
78 - WindowModel.shared.setPreferredOrientation(window.Orientation.LANDSCAPE);  
79 - devicePLSensorManager.devicePLSensorOn(window.Orientation.LANDSCAPE);  
80 - })  
81 - }  
82 - .width('100%')  
83 - // .margin({ bottom: 120 })  
84 - .alignItems(HorizontalAlign.Center)  
85 - } 65 + // if (this.contentDetailData?.videoInfo[0]?.videoLandScape === 1) {
  66 + // Column() {
  67 + // Row() {
  68 + // Image($r('app.media.ic_switch_orientation'))
  69 + // .width(16)
  70 + // .aspectRatio(1)
  71 + // .objectFit(ImageFit.Contain)
  72 + // .padding({ left: 8, right: 4 })
  73 + // Text("全屏观看")
  74 + // .fontColor(Color.White)
  75 + // .fontSize(12)
  76 + // .layoutWeight(1)
  77 + // }
  78 + // .width(84)
  79 + // .height(28)
  80 + // .backgroundColor('#0d0d0d')
  81 + // .border({ width: 1, color: '#4DFFFFFF', radius: 2 })
  82 + // .alignItems(VerticalAlign.Center)
  83 + // .justifyContent(FlexAlign.Center)
  84 + // .visibility(this.videoLandScape == 2 ? Visibility.Hidden : Visibility.Visible)
  85 + // .onClick(() => {
  86 + // // this.isFullScreen = !this.isFullScreen;
  87 + // // WindowModel.shared.setPreferredOrientation(window.Orientation.LANDSCAPE);
  88 + // // devicePLSensorManager.devicePLSensorOn(window.Orientation.LANDSCAPE);
  89 + // })
  90 + // }
  91 + // .width('100%')
  92 + // .margin({ top: 452 })
  93 + //
  94 + // }
86 95
87 96
88 Row() { 97 Row() {
@@ -103,7 +112,7 @@ export struct PlayerTitleComment { @@ -103,7 +112,7 @@ export struct PlayerTitleComment {
103 } 112 }
104 113
105 114
106 - if (this.contentDetailData?.newsSummary) { 115 + if (this.contentDetailData?.newsSummary && this.showComment) {
107 Text('查看详情 > ') 116 Text('查看详情 > ')
108 .margin({ top: 8 }) 117 .margin({ top: 8 })
109 .padding(6) 118 .padding(6)
@@ -123,7 +132,9 @@ export struct PlayerTitleComment { @@ -123,7 +132,9 @@ export struct PlayerTitleComment {
123 .alignItems(HorizontalAlign.Start) 132 .alignItems(HorizontalAlign.Start)
124 .margin({ left: 16 }) 133 .margin({ left: 16 })
125 134
126 - OperationListView() 135 + OperationListView({
  136 + playerController: this.playerController
  137 + })
127 .width(48) 138 .width(48)
128 } 139 }
129 .width('100%') 140 .width('100%')
@@ -134,39 +145,49 @@ export struct PlayerTitleComment { @@ -134,39 +145,49 @@ export struct PlayerTitleComment {
134 Slider({ 145 Slider({
135 value: this.progressVal, 146 value: this.progressVal,
136 step: 1, 147 step: 1,
137 - style: SliderStyle.OutSet 148 + // style: SliderStyle.OutSet
138 }) 149 })
139 - .blockColor(Color.White)  
140 - .trackColor($r('app.color.track_color'))  
141 - .selectedColor($r('app.color.index_tab_selected_font_color'))  
142 - .trackThickness(1) 150 + .blockColor(this.status === PlayerConstants.STATUS_START ? Color.Transparent : $r('app.color.play_block_color'))
  151 + .trackColor(this.status === PlayerConstants.STATUS_START ? $r('app.color.play_track_color') : $r('app.color.pause_track_color'))
  152 + .selectedColor(this.status === PlayerConstants.STATUS_START ? $r('app.color.play_selected_color') : $r('app.color.pause_selected_color'))
  153 + .trackThickness(this.status === PlayerConstants.STATUS_START ? 1 : 4)
  154 + .blockStyle({
  155 + type: this.status === PlayerConstants.STATUS_START ? SliderBlockType.DEFAULT : SliderBlockType.IMAGE,
  156 + image: $r('app.media.ic_player_block')
  157 + })
  158 + .blockSize({ width: 18, height: 12 })
143 .width('100%') 159 .width('100%')
  160 + .height(19)
144 .onChange((value: number, mode: SliderChangeMode) => { 161 .onChange((value: number, mode: SliderChangeMode) => {
145 this.playerController?.setSeekTime(value, mode); 162 this.playerController?.setSeekTime(value, mode);
146 }) 163 })
147 164
148 - Row() {  
149 - Image($r('app.media.ic_back'))  
150 - .width(24)  
151 - .height(24)  
152 - .aspectRatio(1)  
153 - .onClick(() => {  
154 - router.back();  
155 - })  
156 -  
157 - TextInput({ placeholder: '说两句...', text: this.comment })  
158 - .placeholderColor(Color.White)  
159 - .placeholderFont({ size: 14 })  
160 - .fontColor(Color.White)  
161 - .fontSize(14)  
162 - .maxLines(1)  
163 - .layoutWeight(1)  
164 - .backgroundColor('#1a1a1a')  
165 - .borderRadius(2)  
166 - .margin({ left: 12 }) 165 + if (this.showComment) {
  166 + Row() {
  167 + Image($r('app.media.ic_back'))
  168 + .width(24)
  169 + .height(24)
  170 + .aspectRatio(1)
  171 + .onClick(() => {
  172 + router.back();
  173 + })
  174 +
  175 + TextInput({ placeholder: '说两句...', text: this.comment })
  176 + .placeholderColor(Color.White)
  177 + .placeholderFont({ size: 14 })
  178 + .fontColor(Color.White)
  179 + .fontSize(14)
  180 + .maxLines(1)
  181 + .layoutWeight(1)
  182 + .backgroundColor('#1a1a1a')
  183 + .borderRadius(2)
  184 + .height(30)
  185 + .margin({ left: 12 })
  186 + }
  187 + .alignItems(VerticalAlign.Center)
  188 + .padding({ left: 16, right: 16, top: 11, bottom: 11 })
167 } 189 }
168 - .alignItems(VerticalAlign.Center)  
169 - .padding({ left: 16, right: 16, top: 11, bottom: 11 }) 190 +
170 } 191 }
171 }.backgroundColor(Color.Black) 192 }.backgroundColor(Color.Black)
172 193
1 { 1 {
2 "color": [ 2 "color": [
3 { 3 {
  4 + "name": "play_block_color",
  5 + "value": "#FFFFFF"
  6 + },
  7 + {
  8 + "name": "play_track_color",
  9 + "value": "#1AFFFFFF"
  10 + },
  11 + {
  12 + "name": "play_selected_color",
  13 + "value": "#4DFFFFFF"
  14 + },
  15 + {
  16 + "name": "pause_block_color",
  17 + "value": "#FFFFFF"
  18 + },
  19 + {
  20 + "name": "pause_track_color",
  21 + "value": "#1AFFFFFF"
  22 + },
  23 + {
  24 + "name": "pause_selected_color",
  25 + "value": "#FFED2800"
  26 + },
  27 + {
4 "name": "index_tab_selected_font_color", 28 "name": "index_tab_selected_font_color",
5 - "value": "#007DFF" 29 + "value": "#4DFFFFFF"
6 }, 30 },
7 { 31 {
8 "name": "divider_color", 32 "name": "divider_color",
@@ -10,7 +34,7 @@ @@ -10,7 +34,7 @@
10 }, 34 },
11 { 35 {
12 "name": "track_color", 36 "name": "track_color",
13 - "value": "#888888" 37 + "value": "#1AFFFFFF"
14 }, 38 },
15 { 39 {
16 "name": "speed_text_color", 40 "name": "speed_text_color",
@@ -22,6 +22,7 @@ export class WDPlayerController { @@ -22,6 +22,7 @@ export class WDPlayerController {
22 public onVolumeUpdate?: (volume: number) => void; 22 public onVolumeUpdate?: (volume: number) => void;
23 public continue?: () => void; 23 public continue?: () => void;
24 public onCanplay?: () => void; 24 public onCanplay?: () => void;
  25 + public onStatusChange?: (status: number) => void;
25 26
26 constructor() { 27 constructor() {
27 Logger.error("初始化") 28 Logger.error("初始化")
@@ -163,92 +164,92 @@ export class WDPlayerController { @@ -163,92 +164,92 @@ export class WDPlayerController {
163 } 164 }
164 165
165 async pause() { 166 async pause() {
166 - if (this.avPlayer == null) {  
167 - await this.initPromise;  
168 - }  
169 - if (this.avPlayer == null) {  
170 - return  
171 - }  
172 - this.avPlayer.pause(); 167 + // if (this.avPlayer == null) {
  168 + // await this.initPromise;
  169 + // }
  170 + // if (this.avPlayer == null) {
  171 + // return
  172 + // }
  173 + this.avPlayer?.pause();
173 } 174 }
174 175
175 async play() { 176 async play() {
176 - if (this.avPlayer == null) {  
177 - await this.initPromise;  
178 - }  
179 - if (this.avPlayer == null) {  
180 - return  
181 - }  
182 - this.avPlayer.play(); 177 + // if (this.avPlayer == null) {
  178 + // await this.initPromise;
  179 + // }
  180 + // if (this.avPlayer == null) {
  181 + // return
  182 + // }
  183 + this.avPlayer?.play();
183 } 184 }
184 185
185 async stop() { 186 async stop() {
186 - if (this.avPlayer == null) {  
187 - await this.initPromise;  
188 - }  
189 - if (this.avPlayer == null) {  
190 - return  
191 - }  
192 - this.avPlayer.stop(); 187 + // if (this.avPlayer == null) {
  188 + // await this.initPromise;
  189 + // }
  190 + // if (this.avPlayer == null) {
  191 + // return
  192 + // }
  193 + this.avPlayer?.stop();
193 } 194 }
194 195
195 async setLoop() { 196 async setLoop() {
196 - if (this.avPlayer == null) {  
197 - await this.initPromise;  
198 - }  
199 - if (this.avPlayer == null) {  
200 - return  
201 - } 197 + // if (this.avPlayer == null) {
  198 + // await this.initPromise;
  199 + // }
  200 + // if (this.avPlayer == null) {
  201 + // return
  202 + // }
202 this.loop = !this.loop; 203 this.loop = !this.loop;
203 } 204 }
204 205
205 async setSpeed(playSpeed: number) { 206 async setSpeed(playSpeed: number) {
206 - if (this.avPlayer == null) {  
207 - await this.initPromise;  
208 - }  
209 - if (this.avPlayer == null) {  
210 - return  
211 - }  
212 - if (PlayerConstants.OPERATE_STATE.indexOf(this.avPlayer.state) === -1) { 207 + // if (this.avPlayer == null) {
  208 + // await this.initPromise;
  209 + // }
  210 + // if (this.avPlayer == null) {
  211 + // return
  212 + // }
  213 + if (this.avPlayer && PlayerConstants.OPERATE_STATE.indexOf(this.avPlayer?.state) === -1) {
213 return; 214 return;
214 } 215 }
215 this.playSpeed = playSpeed; 216 this.playSpeed = playSpeed;
216 - this.avPlayer.setSpeed(this.playSpeed); 217 + this.avPlayer?.setSpeed(this.playSpeed);
217 } 218 }
218 219
219 async switchPlayOrPause() { 220 async switchPlayOrPause() {
220 - if (this.avPlayer == null) {  
221 - await this.initPromise;  
222 - }  
223 - if (this.avPlayer == null) {  
224 - return  
225 - } 221 + // if (this.avPlayer == null) {
  222 + // await this.initPromise;
  223 + // }
  224 + // if (this.avPlayer == null) {
  225 + // return
  226 + // }
226 if (this.status === PlayerConstants.STATUS_START) { 227 if (this.status === PlayerConstants.STATUS_START) {
227 - this.avPlayer.pause(); 228 + this.avPlayer?.pause();
228 } else { 229 } else {
229 - this.avPlayer.play(); 230 + this.avPlayer?.play();
230 } 231 }
231 } 232 }
232 233
233 async setSeekTime(value: number, mode: SliderChangeMode) { 234 async setSeekTime(value: number, mode: SliderChangeMode) {
234 - if (this.avPlayer == null) {  
235 - await this.initPromise;  
236 - }  
237 - if (this.avPlayer == null) {  
238 - return  
239 - }  
240 - if (mode == SliderChangeMode.Begin) {  
241 - this.seekTime = value * 1000;  
242 - this.avPlayer.seek(this.seekTime, media.SeekMode.SEEK_PREV_SYNC);  
243 - } 235 + // if (this.avPlayer == null) {
  236 + // await this.initPromise;
  237 + // }
  238 + // if (this.avPlayer == null) {
  239 + // return
  240 + // }
  241 + // if (mode == SliderChangeMode.Begin) {
  242 + // this.seekTime = value * 1000;
  243 + // this.avPlayer?.seek(this.seekTime, media.SeekMode.SEEK_PREV_SYNC);
  244 + // }
244 if (mode === SliderChangeMode.Moving) { 245 if (mode === SliderChangeMode.Moving) {
245 // this.progressThis.progressVal = value; 246 // this.progressThis.progressVal = value;
246 // this.progressThis.currentTime = DateFormatUtil.secondToTime(Math.floor(value * this.duration / 247 // this.progressThis.currentTime = DateFormatUtil.secondToTime(Math.floor(value * this.duration /
247 // 100 / 1000)); 248 // 100 / 1000));
248 } 249 }
249 if (mode === SliderChangeMode.End) { 250 if (mode === SliderChangeMode.End) {
250 - this.seekTime = value * this.duration / 100;  
251 - this.avPlayer.seek(this.seekTime, media.SeekMode.SEEK_PREV_SYNC); 251 + this.seekTime = value * this.duration;
  252 + this.avPlayer?.seek(this.seekTime, media.SeekMode.SEEK_PREV_SYNC);
252 } 253 }
253 } 254 }
254 255
@@ -333,6 +334,10 @@ export class WDPlayerController { @@ -333,6 +334,10 @@ export class WDPlayerController {
333 } 334 }
334 335
335 watchStatus() { 336 watchStatus() {
  337 + console.log('watchStatus', this.status)
  338 + if (this.onStatusChange) {
  339 + this.onStatusChange(this.status)
  340 + }
336 // if (this.status === PlayConstants.STATUS_START) { 341 // if (this.status === PlayConstants.STATUS_START) {
337 // globalThis.windowClass.setWindowKeepScreenOn(true); 342 // globalThis.windowClass.setWindowKeepScreenOn(true);
338 // } else { 343 // } else {
@@ -94,17 +94,27 @@ export struct WDPlayerRenderView { @@ -94,17 +94,27 @@ export struct WDPlayerRenderView {
94 }) 94 })
95 .width(this.selfSize.width) 95 .width(this.selfSize.width)
96 .height(this.selfSize.height) 96 .height(this.selfSize.height)
  97 + .margin({ top: this.getPlayerMarginTop() })
97 } 98 }
98 .id(this.insId) 99 .id(this.insId)
99 .onAreaChange(() => { 100 .onAreaChange(() => {
100 // this.updateLayout() 101 // this.updateLayout()
101 }) 102 })
102 .backgroundColor("#000000") 103 .backgroundColor("#000000")
  104 + .alignItems(VerticalAlign.Center)
103 .justifyContent(FlexAlign.Center) 105 .justifyContent(FlexAlign.Center)
  106 + .alignItems(this.selfSize.width === '100%' ? VerticalAlign.Top : VerticalAlign.Center)
104 .height('100%') 107 .height('100%')
105 .width('100%') 108 .width('100%')
106 } 109 }
107 110
  111 + /**
  112 + * 横屏播放器非居中展示
  113 + */
  114 + getPlayerMarginTop() {
  115 + return this.selfSize.width === '100%' && this.videoWidth > this.videoHeight ? 218 : 0
  116 + }
  117 +
108 updateLayout() { 118 updateLayout() {
109 let info = componentUtils.getRectangleById(this.insId); 119 let info = componentUtils.getRectangleById(this.insId);
110 if (info.size.width > 0 && info.size.height > 0 && this.videoHeight > 0 && this.videoWidth > 0) { 120 if (info.size.width > 0 && info.size.height > 0 && this.videoHeight > 0 && this.videoWidth > 0) {