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 177 additions and 83 deletions
... ... @@ -136,6 +136,10 @@ export class WindowModel {
this.windowClass?.setWindowSystemBarEnable(names)
}
getWindowProperties() {
return this.windowClass?.getWindowProperties()
}
setWindowLayoutFullScreen(isFullScreen: boolean) {
this.isFullScreen = isFullScreen
this.windowClass?.setWindowLayoutFullScreen(isFullScreen)
... ...
import { Action, LiveDetailsBean } from 'wdBean/Index';
import { LiveViewModel } from '../viewModel/LiveViewModel';
import router from '@ohos.router';
import { DetailPlayLivePage } from './DetailPlayLivePage'
import { DetailPlayVLivePage } from './DetailPlayVLivePage'
@Entry()
@Component
export struct DetailPlayLiveCommon {
TAG: string = 'DetailPlayLiveCommon';
private liveViewModel: LiveViewModel = new LiveViewModel()
@State liveDetailsBean: LiveDetailsBean = {} as LiveDetailsBean
@State liveState: string = ''
@State liveStyle: number = -1
@State relId: string = ''
@State contentId: string = ''
@State relType: string = ''
aboutToAppear(): void {
//https://pdapis.pdnews.cn/api/rmrb-bff-display-zh/content/zh/c/content/detail?relId=500005302448&relType=1&contentId=20000016340
const par: Action = router.getParams() as Action;
const params = par?.params;
this.relId = params?.extra?.relId || '';
this.relType = params?.extra?.relType || '';
this.contentId = params?.contentID || '';
this.getLiveDetails()
}
build() {
Column() {
if (this.liveState === 'wait' || this.liveStyle === 0) {
DetailPlayLivePage({ contentId: this.contentId, relId: this.relId, relType: this.relType })
} else if (this.liveStyle === 1) {
DetailPlayVLivePage({ contentId: this.contentId, relId: this.relId, relType: this.relType })
}
}
.height('100%')
.width('100%')
}
getLiveDetails() {
this.liveViewModel.getLiveDetails(this.contentId, this.relId, this.relType)
.then(
(data) => {
if (data.length > 0) {
this.liveDetailsBean = data[0]
this.liveState = this.liveDetailsBean.liveInfo?.liveState
this.liveStyle = this.liveDetailsBean.liveInfo.liveStyle
console.error('liveDetailsBean===', JSON.stringify((this.liveDetailsBean)))
}
},
() => {
})
}
}
... ...
... ... @@ -12,7 +12,7 @@ const storage = LocalStorage.getShared();
@Entry(storage)
@Component
export struct DetailPlayVLivePage {
TAG: string = 'DetailPlayLivePage';
TAG: string = 'DetailPlayVLivePage';
private liveViewModel: LiveViewModel = new LiveViewModel()
private playerController: WDPlayerController = new WDPlayerController();
private swiperController: SwiperController = new SwiperController()
... ...
... ... @@ -10,13 +10,13 @@ export struct ChatItemComponent {
build() {
Row() {
Text() {
if (this.item.senderUserName) {
Span(' 主持人 ')
.fontSize(11)
.lineHeight(20)
.textBackgroundStyle({ color: '#808562', radius: 2 })
Span(' ')
}
// if (this.item.senderUserName) {
// Span(' 主持人 ')
// .fontSize(11)
// .lineHeight(20)
// .textBackgroundStyle({ color: '#808562', radius: 2 })
// Span(' ')
// }
Span(this.item.senderUserName + ': ')
.fontColor('#FFFFC63F')
.padding({ right: 118 })
... ...
... ... @@ -34,6 +34,9 @@ export struct DetailPlayShortVideoPage {
@Provide followStatus: string = '0' // 关注状态
@Link @Watch('switchVideoStatusChange') switchVideoStatus: boolean
/**
* 直播频道从其他频道切换回来需要继续播放视频
*/
switchVideoStatusChange() {
if (this.switchVideoStatus) {
if (this.currentIndex === this.index && this.playerController.getStatus() === PlayerConstants.STATUS_PAUSE) {
... ... @@ -152,13 +155,9 @@ export struct DetailPlayShortVideoPage {
console.log('aboutToDisappear', this.index)
this.playerController?.pause()
this.playerController?.release();
// this.playerController.onCanplay = ()={}
}
onPageHide() {
// WindowModel.shared.setPreferredOrientation(window.Orientation.PORTRAIT);
// devicePLSensorManager.devicePLSensorOff();
// this.status = PlayerConstants.STATUS_PAUSE;
this.playerController?.pause();
}
... ... @@ -175,8 +174,8 @@ export struct DetailPlayShortVideoPage {
})
.height('100%')
.width('100%')
.margin({ top: this.videoLandScape === 1 ? 218 : 0 })
.align(this.videoLandScape === 1 ? Alignment.Top : Alignment.Start)
.margin({ bottom: this.videoLandScape === 1 ? 130 : 0 })
.align(this.videoLandScape === 0 ? Alignment.Top : Alignment.Center)
.onClick(() => {
console.error('WDPlayerRenderView=== onClick')
this.playerController?.switchPlayOrPause();
... ... @@ -209,7 +208,8 @@ export struct DetailPlayShortVideoPage {
this.detailContainerBuilder()
}
})
}.height('100%')
}
.height('100%')
.width('100%')
}
... ...
... ... @@ -7,17 +7,16 @@ import { contentListParams } from 'wdDetailPlayApi/src/main/ets/request/ContentD
import { WindowModel } from 'wdKit';
const storage = LocalStorage.getShared();
const TAG = 'DetailVideoListPage'
@Entry(storage)
@Component
export struct DetailVideoListPage {
@Provide showComment: boolean = true
@State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
@State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
private contentId: string = ''
private relId: string = ''
private relType: string = ''
private swiperController: SwiperController = new SwiperController()
@Provide showComment: boolean = true
@State data: ContentDetailDTO[] = []
@State testData: string[] = ['111', '222', '333']
@State currentIndex: number = 0
... ... @@ -26,83 +25,74 @@ export struct DetailVideoListPage {
@State switchVideoStatus: boolean = false
async aboutToAppear(): Promise<void> {
this.openFullScreen()
/**
* 开启沉浸式并设置状态栏颜色
*/
// const windowStage = WindowModel.shared.getWindowStage() as window.WindowStage
// const windowClass: window.Window = windowStage.getMainWindowSync();
// windowClass.setWindowLayoutFullScreen(true)
// this.isFullScreen = true
// windowClass.setWindowSystemBarProperties({
// statusBarContentColor: '#ffffff',
// })
// let data: ContentDetailDTO[] = []
let action: Action = router.getParams() as Action
const action: Action = router.getParams() as Action
if (action) {
this.contentId = action.params?.contentID || ''
if (action.params && action.params.extra) {
this.relId = action.params.extra.relId || ''
this.relType = action.params.extra.relType || ''
}
await ContentDetailRequest.getContentDetail({
contentId: this.contentId,
relId: this.relId,
relType: this.relType
}).then((resDTO: ResponseDTO<ContentDetailDTO[]>) => {
console.error('resDTO==', JSON.stringify(resDTO.data))
if (resDTO.data) {
this.data.push(resDTO.data[0])
}
})
await this.getContentDetail(this.contentId, this.relId, this.relType)
}
await this.queryVideoList()
this.getContentInteract()
if (this.data.length > 0) {
const params: contentListParams = {
contentList: []
console.log(TAG, 'aboutToAppear', JSON.stringify(action.params))
}
this.data.map(item => {
params.contentList.push({
contentId: item.newsId + '',
contentType: item.newsType
})
})
// 批量查询内容当前用户点赞、收藏状态
await ContentDetailRequest.getContentInteract(params).then(res => {
if (res.data) {
this.interactDataList = res.data || []
}
console.log('获取互动点赞等数据===', JSON.stringify(res))
})
// 查询各类型内容动态数据接口V2
aboutToDisappear(): void {
console.log(TAG, 'aboutToDisappear')
this.closeFullScreen()
}
// this.data = data
console.error('aboutToAppear===', this.data.length)
onPageShow(): void {
console.log(TAG, 'onPageShow')
this.openFullScreen()
console.log('getWindowProperties', JSON.stringify(WindowModel.shared.getWindowProperties()))
}
aboutToDisappear(): void {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', })
WindowModel.shared.setWindowLayoutFullScreen(false)
onPageHide(): void {
console.log(TAG, 'onPageHide')
this.closeFullScreen()
}
onPageShow(): void {
/**
* 开启沉浸式
* TODO:颜色待根据业务接口修改
*/
openFullScreen() {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', })
WindowModel.shared.setWindowLayoutFullScreen(true)
// WindowModel.shared.setWindowLayoutFullScreen(true)
// WindowModel.shared.setWindowSystemBarEnable([])
}
onPageHide(): void {
/**
* 关闭沉浸式
* TODO:颜色待根据业务接口修改
*/
closeFullScreen() {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', })
WindowModel.shared.setWindowLayoutFullScreen(false)
// WindowModel.shared.setWindowLayoutFullScreen(false)
// WindowModel.shared.setWindowSystemBarEnable(['status', 'navigation'])
}
async getContentDetail(contentId: string, relId: string, relType: string) {
await ContentDetailRequest.getContentDetail({
contentId: contentId,
relId: relId,
relType: relType
}).then((resDTO: ResponseDTO<ContentDetailDTO[]>) => {
console.error('getContentDetail==', JSON.stringify(resDTO.data))
if (resDTO.data) {
this.data.push(resDTO.data[0])
}
})
}
/**
... ... @@ -116,14 +106,36 @@ export struct DetailVideoListPage {
if (res.data) {
this.data = this.data.concat(res.data)
}
// console.log('queryVideoList===', JSON.stringify(this.data))
})
}
/**
* 批量查询内容当前用户点赞、收藏状态
*/
getContentInteract() {
if (this.data.length > 0) {
const params: contentListParams = {
contentList: []
}
this.data.map(item => {
params.contentList.push({
contentId: item.newsId + '',
contentType: item.newsType
})
})
// 批量查询内容当前用户点赞、收藏状态
ContentDetailRequest.getContentInteract(params).then(res => {
if (res.data) {
this.interactDataList = res.data || []
}
console.log('获取互动点赞等数据===', JSON.stringify(res))
})
}
}
build() {
Column() {
Swiper(this.swiperController) {
ForEach(this.data, (item: ContentDetailDTO, index: number) => {
Column() {
DetailPlayShortVideoPage({
... ... @@ -153,6 +165,10 @@ export struct DetailVideoListPage {
this.queryVideoList()
}
})
}.width('100%').height('100%').backgroundColor(Color.Black).padding({ bottom: this.bottomSafeHeight + 'px' })
}
.width('100%')
.height('100%')
.backgroundColor(Color.Black)
.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM, SafeAreaEdge.START, SafeAreaEdge.END])
}
}
\ No newline at end of file
... ...
... ... @@ -71,29 +71,45 @@ export struct VideoChannelDetail {
}
aboutToAppear() {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', statusBarColor: '#000000' })
// WindowModel.shared.setWindowLayoutFullScreen(true)
this.openFullScreen()
// 根据视频频道传参查询视频楼层信息
this.getRecCompInfo()
Logger.info(TAG, 'aboutToAppear');
}
aboutToDisappear(): void {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', statusBarColor: '#ffffff' })
// WindowModel.shared.setWindowLayoutFullScreen(false)
this.closeFullScreen()
Logger.info(TAG, 'aboutToDisappear');
}
onPageShow(): void {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', statusBarColor: '#000000' })
// onPageShow(): void {
// this.openFullScreen()
// Logger.info(TAG, 'onPageShow');
// }
//
// onPageHide(): void {
// this.closeFullScreen()
// Logger.info(TAG, 'onPageHide');
// }
/**
* 开启沉浸式
* TODO:颜色待根据业务接口修改
*/
openFullScreen() {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#ffffff', })
// WindowModel.shared.setWindowLayoutFullScreen(true)
Logger.info(TAG, 'onPageShow');
// WindowModel.shared.setWindowSystemBarEnable([])
}
onPageHide(): void {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', statusBarColor: '#ffffff' })
/**
* 关闭沉浸式
* TODO:颜色待根据业务接口修改
*/
closeFullScreen() {
WindowModel.shared.setWindowSystemBarProperties({ statusBarContentColor: '#000000', })
// WindowModel.shared.setWindowLayoutFullScreen(false)
Logger.info(TAG, 'onPageHide');
// WindowModel.shared.setWindowSystemBarEnable(['status', 'navigation'])
}
/**
... ...