developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
zhenghy
f77228df 1 parent a6d274a7

修复频道视频黑屏问题

Inline Side-by-side
Showing 9 changed files with 59 additions and 103 deletions
... ... @@ -19,7 +19,8 @@ export struct DetailPlayVLivePage {
@Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
@Provide liveDetailsBean: LiveDetailsBean = {} as LiveDetailsBean
@Provide liveRoomDataBean: LiveRoomDataBean = {} as LiveRoomDataBean
@Provide isMenuVisible: boolean = false
@Provide isShowControl: boolean = false
@Provide liveState: string = ''
@State relId: string = ''
@State contentId: string = ''
@State relType: string = ''
... ... @@ -52,7 +53,7 @@ export struct DetailPlayVLivePage {
playerController: this.playerController
})
.onClick(() => {
this.isMenuVisible = !this.isMenuVisible
this.isShowControl = !this.isShowControl
})
PlayerInfoComponent({
... ... @@ -79,16 +80,13 @@ export struct DetailPlayVLivePage {
.width('100%')
}
onPageShow(): void {
}
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
console.error('liveDetailsBean===', JSON.stringify((this.liveDetailsBean)))
}
},
... ...
... ... @@ -6,6 +6,7 @@ import { NumberFormatterUtils } from 'wdKit/Index'
export struct PlayerTitleComponent {
@Consume liveDetailsBean: LiveDetailsBean
@Consume liveRoomDataBean: LiveRoomDataBean
@Consume liveState: string
build() {
Column() {
... ... @@ -38,8 +39,9 @@ export struct PlayerTitleComponent {
Image(this.liveDetailsBean.rmhInfo?.rmhHeadUrl || '')
.width(24)
.aspectRatio(1)
.borderRadius('50%')
.borderRadius(12)
.fillColor(Color.Transparent)
Text(this.liveDetailsBean.rmhInfo?.rmhName || '')
.fontSize(12)
.fontWeight(500)
... ... @@ -53,19 +55,20 @@ export struct PlayerTitleComponent {
}
.backgroundColor('#4D000000')
.borderRadius(2)
.borderRadius({ topLeft: 12, bottomLeft: 12 })
.margin({ right: 8 })
}
Row() {
if (this.liveDetailsBean.liveInfo?.liveState == 'running') {
if (this.liveState == 'running') {
Image($r('app.media.icon_live_status_running'))
.width(22)
.height(18)
.margin({ right: 1 })
}
Text(this.liveDetailsBean.liveInfo?.liveState == 'running' ? '直播中' : '回看')
Text(this.liveState == 'running' ? '直播中' : '回看')
.fontSize(11)
.fontWeight(400)
.fontColor(Color.White)
... ... @@ -79,6 +82,6 @@ export struct PlayerTitleComponent {
}
.backgroundColor('#4D000000')
.borderRadius(2)
.padding(this.liveDetailsBean.liveInfo?.liveState == 'running' ? { left: 0, right: 4, top: 0, bottom: 0 } : 4)
.padding(this.liveState == 'running' ? { left: 0, right: 4, top: 0, bottom: 0 } : 4)
}
}
... ...
... ... @@ -6,13 +6,17 @@ import { PlayerVideoControlComponent } from './PlayerVideoControlComponent';
@Component
export struct PlayerUIComponent {
private playerController?: WDPlayerController
@Consume liveState: string
build() {
Column() {
PlayerTitleComponent()
Blank()
// PlayerCommentComponent().layoutWeight(1)
PlayerVideoControlComponent({ playerController: this.playerController })
if (this.liveState === 'end') {
PlayerVideoControlComponent({ playerController: this.playerController })
}
}
.height('100%')
.width('100%')
... ...
... ... @@ -42,39 +42,36 @@ export struct PlayerVideoControlComponent {
@Builder
getBottomUIComponent() {
Row() {
if (this.liveDetailsBean?.liveInfo?.liveState == 'end') {
this.playOrPauseBtn()
Text(this.currentTime)
.fontColor(Color.White)
.fontWeight(600)
.fontSize('12fp')
.margin({
left: 16
})
this.playOrPauseBtn()
Text(this.currentTime)
.fontColor(Color.White)
.fontWeight(600)
.fontSize('12fp')
.margin({
left: 16
})
this.playProgressView()
this.playProgressView()
Text(this.totalTime)
.fontColor(Color.White)
.fontWeight(600)
.fontSize('12fp')
.margin({
right: 16
})
} else {
Blank()
}
Image($r('app.media.icon_live_player_full_screen'))
.width(24)
.height(24)
.onClick(() => {
this.isFullScreen = !this.isFullScreen
WindowModel.shared.setPreferredOrientation(this.isFullScreen ? window.Orientation.LANDSCAPE : window.Orientation.PORTRAIT);
devicePLSensorManager.devicePLSensorOn(this.isFullScreen ? window.Orientation.LANDSCAPE : window.Orientation.PORTRAIT);
Text(this.totalTime)
.fontColor(Color.White)
.fontWeight(600)
.fontSize('12fp')
.margin({
right: 16
})
// Image($r('app.media.icon_live_player_full_screen'))
// .width(24)
// .height(24)
// .onClick(() => {
// this.isFullScreen = !this.isFullScreen
// WindowModel.shared.setPreferredOrientation(this.isFullScreen ? window.Orientation.LANDSCAPE : window.Orientation.PORTRAIT);
// devicePLSensorManager.devicePLSensorOn(this.isFullScreen ? window.Orientation.LANDSCAPE : window.Orientation.PORTRAIT);
// })
}
.alignItems(VerticalAlign.Center)
.linearGradient({ angle: 0, colors: [['#99000000', 0], ['#00000000', 1]] })
// .linearGradient({ angle: 0, colors: [['#99000000', 0], ['#00000000', 1]] })
.width('100%')
.padding({
left: 10,
... ...
... ... @@ -168,17 +168,15 @@ export struct DetailPlayShortVideoPage {
WDPlayerRenderView({
playerController: this.playerController,
onLoad: async () => {
// console.log('onload==', this.index)
// if (this.index === 0) {
if (this.contentDetailData != null && this.contentDetailData?.videoInfo[0] != null) {
this.playerController.firstPlay(this.contentDetailData.videoInfo[0].videoUrl);
}
// }
}
})
.height('100%')
.width('100%')
.margin({ top: this.videoLandScape === 1 ? 218 : 0 })
.align(this.videoLandScape === 1 ? Alignment.Top : Alignment.Start)
.onClick(() => {
console.error('WDPlayerRenderView=== onClick')
this.playerController?.switchPlayOrPause();
... ... @@ -195,14 +193,13 @@ export struct DetailPlayShortVideoPage {
@Builder
detailContainerBuilder() {
// DetailTabBarPageComponent({ pageId: this.pageId }).backgroundColor(Color.Black)
DetailContainer({
playerController: this.playerController
})
}
build() {
Row() {
Column() {
PlayerDetailContainer({
playerView: () => {
this.playerViewContainerBuilder()
... ... @@ -212,17 +209,8 @@ export struct DetailPlayShortVideoPage {
this.detailContainerBuilder()
}
})
.height('100%')
.width('100%')
.onClick(() => {
console.error('PlayerDetailContainer=== onClick')
this.playerController?.switchPlayOrPause();
})
}
.height('100%')
}.height('100%')
.width('100%')
.backgroundColor(Color.Black)
// 扩展至所有非安全区域
.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
}
}
\ No newline at end of file
... ...
... ... @@ -12,6 +12,5 @@ export struct DetailContainer {
PlayerTitleComment({
playerController: this.playerController
})
.width('100%')
}
}
\ No newline at end of file
... ...
... ... @@ -45,7 +45,7 @@ export struct DetailDialog {
}
.width('100%')
.alignItems(HorizontalAlign.Start)
.backgroundColor(Color.Gray)
.backgroundColor('#80000000')
// .linearGradient({
// direction: GradientDirection.Top, // 渐变方向
// repeating: false, // 渐变颜色是否重复
... ...
... ... @@ -60,52 +60,14 @@ export struct PlayerDetailContainer {
}
build() {
RelativeContainer() {
Row() {
Stack() {
Row() {
this.playerView()
}
.height('100%')
.width('100%')
.zIndex(0)
.margin({ top: this.videoLandScape === 1 ? 218 : 0 })
Row() {
this.playControlView()
}
.height('100%')
.width('100%')
.zIndex(1)
}
.width('100%')
.height('100%')
// .aspectRatio(this.isFullScreen ? 0.1 : 16 / 9.0) // 若width值确定，当aspectRatio值越小，则height值越大
// .height(this.isFullScreen ? '100%' : this.buildVideoHeight())
// .margin({ top: this.isFullScreen ? 0 : this.buildVideoTo() })
// .margin({ bottom: this.isFullScreen ? 0 : this.buildVideoBottom() })
.alignRules({
top: { anchor: '__container__', align: VerticalAlign.Top },
// middle: { anchor: '__container__', align: HorizontalAlign.Center }
})
.id('stk_player_container')
}.height('100%').layoutWeight(1)
if (this.isShowBottomView()) {
Row() {
this.detailView()
}
.width('100%')
// .opacity(0.3)
.alignRules({
bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
// middle: { anchor: '__container__', align: HorizontalAlign.Center }
})
.id('row_bottomView')
}
Stack() {
this.playerView()
this.detailView()
}
.width('100%')
.height('100%')
// .backgroundColor(Color.Black) // 扩展至所有非安全区域
// .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
}
}
\ No newline at end of file
... ...
... ... @@ -140,7 +140,11 @@ export struct PlayerTitleComment {
.width(48)
}
.width('100%')
.layoutWeight(1)
.alignItems(VerticalAlign.Bottom)
.onClick(() => {
this.playerController?.switchPlayOrPause()
})
Row() {
Column() {
... ... @@ -194,9 +198,10 @@ export struct PlayerTitleComment {
}.backgroundColor(Color.Black)
}
.height('100%')
.width('100%')
// .height('40%')
.alignItems(HorizontalAlign.Start)
.alignItems(HorizontalAlign.End)
.align(Alignment.End)
.opacity(this.isOpen ? 0 : 1)
.animation({ duration: 200 })
}
... ...