developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
liyubing
299e3e21 1 parent 37274794

feat: 

1、直播全屏聊天室，重试机制
Inline Side-by-side
Showing 4 changed files with 111 additions and 56 deletions
@@ -40,8 +40,6 @@ export struct DetailPlayLivePage { @@ -40,8 +40,6 @@ export struct DetailPlayLivePage {
40 @State lastInputedLiveComment: LiveRoomItemBean = {} as LiveRoomItemBean // 上次输入的直播间消息 40 @State lastInputedLiveComment: LiveRoomItemBean = {} as LiveRoomItemBean // 上次输入的直播间消息
41 @State lastInputedChatComment: LiveRoomItemBean = {} as LiveRoomItemBean // 上次输入的大家聊消息 41 @State lastInputedChatComment: LiveRoomItemBean = {} as LiveRoomItemBean // 上次输入的大家聊消息
42 42
43 -  
44 -  
45 aboutToAppear(): void { 43 aboutToAppear(): void {
46 Logger.info(TAG, `wyj-aboutToAppear`) 44 Logger.info(TAG, `wyj-aboutToAppear`)
47 45
@@ -69,9 +67,8 @@ export struct DetailPlayLivePage { @@ -69,9 +67,8 @@ export struct DetailPlayLivePage {
69 build() { 67 build() {
70 Column() { 68 Column() {
71 69
72 - TopPlayComponent({ playerController: this.playerController })  
73 - .height(this.displayDirection == DisplayDirection.VERTICAL ? 211 : '100%')  
74 - 70 + TopPlayComponent({ playerController: this.playerController })
  71 + .height(this.displayDirection == DisplayDirection.VERTICAL ? 211 : '100%')
75 72
76 TabComponent({ 73 TabComponent({
77 tabs: this.tabs, 74 tabs: this.tabs,
1 -import { LiveRoomDataBean } from 'wdBean/Index'; 1 +import { ContentDetailDTO, LiveRoomDataBean } from 'wdBean/Index';
2 import { LiveViewModel } from '../viewModel/LiveViewModel'; 2 import { LiveViewModel } from '../viewModel/LiveViewModel';
3 import { WindowModel } from 'wdKit/Index'; 3 import { WindowModel } from 'wdKit/Index';
4 import { PlayerComponent } from '../widgets/vertical/PlayerComponent'; 4 import { PlayerComponent } from '../widgets/vertical/PlayerComponent';
@@ -22,6 +22,7 @@ export struct DetailPlayVLivePage { @@ -22,6 +22,7 @@ export struct DetailPlayVLivePage {
22 private liveViewModel: LiveViewModel = new LiveViewModel() 22 private liveViewModel: LiveViewModel = new LiveViewModel()
23 private playerController: WDAliPlayerController = new WDAliPlayerController(); 23 private playerController: WDAliPlayerController = new WDAliPlayerController();
24 private swiperController: SwiperController = new SwiperController() 24 private swiperController: SwiperController = new SwiperController()
  25 + @Consume contentDetailData: ContentDetailDTO
25 @Provide bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0 26 @Provide bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
26 @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0 27 @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
27 @Provide liveRoomDataBean: LiveRoomDataBean = {} as LiveRoomDataBean 28 @Provide liveRoomDataBean: LiveRoomDataBean = {} as LiveRoomDataBean
@@ -36,6 +37,9 @@ export struct DetailPlayVLivePage { @@ -36,6 +37,9 @@ export struct DetailPlayVLivePage {
36 @Consume contentId: string 37 @Consume contentId: string
37 @State swiperIndex: number = 1 38 @State swiperIndex: number = 1
38 @Consume liveDetailPageLogic: LiveDetailPageLogic 39 @Consume liveDetailPageLogic: LiveDetailPageLogic
  40 + //播放错误
  41 + @State isPlayerError: boolean = false
  42 + @State isCanplay: boolean = false
39 43
40 aboutToAppear(): void { 44 aboutToAppear(): void {
41 this.openFullScreen() 45 this.openFullScreen()
@@ -78,28 +82,27 @@ export struct DetailPlayVLivePage { @@ -78,28 +82,27 @@ export struct DetailPlayVLivePage {
78 LiveEmptyComponent({ 82 LiveEmptyComponent({
79 emptyType: WDLiveViewDefaultType.WDViewDefaultType_NoLiveSuspend 83 emptyType: WDLiveViewDefaultType.WDViewDefaultType_NoLiveSuspend
80 }) 84 })
81 - .height('40%').margin({top:this.topSafeHeight }) 85 + .height('40%').margin({ top: this.topSafeHeight })
82 } else { 86 } else {
83 87
84 if (this.liveDetailPageLogic.showPad) { 88 if (this.liveDetailPageLogic.showPad) {
85 // 有垫片 89 // 有垫片
86 - if(this.liveDetailPageLogic.padImageUri.length > 0){ 90 + if (this.liveDetailPageLogic.padImageUri.length > 0) {
87 // 配置了垫片资源 91 // 配置了垫片资源
88 Image(this.liveDetailPageLogic.padImageUri).objectFit(ImageFit.Fill).width('100%').height('100%') 92 Image(this.liveDetailPageLogic.padImageUri).objectFit(ImageFit.Fill).width('100%').height('100%')
89 93
90 - }else {  
91 - // 没有配置垫片资源 94 + } else {
  95 + // 没有配置垫片资源
92 LiveEmptyComponent({ 96 LiveEmptyComponent({
93 emptyType: WDLiveViewDefaultType.WDViewDefaultType_NoLiveSuspend 97 emptyType: WDLiveViewDefaultType.WDViewDefaultType_NoLiveSuspend
94 }) 98 })
95 - .height('40%').margin({top:this.topSafeHeight }) 99 + .height('40%').margin({ top: this.topSafeHeight })
96 } 100 }
97 101
98 -  
99 } else { 102 } else {
100 // 播放器 103 // 播放器
101 PlayerComponent({ 104 PlayerComponent({
102 - playerController: this.playerController 105 + playerController: this.playerController, isPlayerError: this.isPlayerError, isCanplay: this.isCanplay
103 }) 106 })
104 } 107 }
105 } 108 }
@@ -110,6 +113,44 @@ export struct DetailPlayVLivePage { @@ -110,6 +113,44 @@ export struct DetailPlayVLivePage {
110 swiperController: this.swiperController, 113 swiperController: this.swiperController,
111 swiperIndex: $swiperIndex 114 swiperIndex: $swiperIndex
112 }) 115 })
  116 +
  117 + // 直播资源加载失败
  118 + Column() {
  119 + Text('直播加载中，请稍候重试')
  120 + .fontSize('20fp')
  121 + .fontWeight(500)
  122 + .margin({ top: 16 })
  123 + .fontColor(Color.White)
  124 +
  125 + Button('点击重试')
  126 + .type(ButtonType.Normal)
  127 + .width(80)
  128 + .height(28)
  129 + .backgroundColor(Color.Transparent)
  130 + .fontColor('#ffcccccc')
  131 + .border({ width: 1 })
  132 + .borderColor('#4dffffff')
  133 + .borderRadius(4)
  134 + .fontSize($r('app.float.font_size_12'))
  135 + .margin({ top: 16 })
  136 + .padding(0)
  137 + .onClick(() => {
  138 +
  139 + this.isCanplay = false
  140 + this.isPlayerError = false
  141 + this.playerController?.firstPlay(this.playUrl, TrackConstants.PageName.Live_Detail, {
  142 + 'contentType': `${this.contentDetailData.newsType}`,
  143 + 'contentId': `${this.contentDetailData.newsId}`,
  144 + 'contentName': `${this.contentDetailData.newsTitle || ''}`,
  145 + });
  146 + })
  147 + }
  148 + .width('100%')
  149 + .margin({ top: 195 })
  150 + .justifyContent(FlexAlign.Center)
  151 + .visibility(this.isPlayerError ? Visibility.Visible :
  152 + Visibility.None)
  153 +
113 // 清屏按钮 154 // 清屏按钮
114 Image($r('app.media.icon_live_more')) 155 Image($r('app.media.icon_live_more'))
115 .width(40) 156 .width(40)
@@ -25,7 +25,7 @@ export struct TopPlayComponent { @@ -25,7 +25,7 @@ export struct TopPlayComponent {
25 //已结束直播 25 //已结束直播
26 @State isEnd: boolean = false 26 @State isEnd: boolean = false
27 //播放错误 27 //播放错误
28 - @State isError: boolean = false 28 + @State isPlayerError: boolean = false
29 // loading 控制字段 29 // loading 控制字段
30 @State isHideLoading: boolean = false 30 @State isHideLoading: boolean = false
31 // 获取播放资源能播放了 31 // 获取播放资源能播放了
@@ -50,14 +50,14 @@ export struct TopPlayComponent { @@ -50,14 +50,14 @@ export struct TopPlayComponent {
50 this.playSourceState = status 50 this.playSourceState = status
51 Logger.debug(TAG, 'status==>' + status) 51 Logger.debug(TAG, 'status==>' + status)
52 if (status === PlayerConstants.STATUS_ERROR) { 52 if (status === PlayerConstants.STATUS_ERROR) {
53 - this.isError = true 53 + this.isPlayerError = true
54 this.isHideLoading = true 54 this.isHideLoading = true
55 this.isCanPlay = false 55 this.isCanPlay = false
56 } else if (status === PlayerConstants.STATUS_COMPLETION) { 56 } else if (status === PlayerConstants.STATUS_COMPLETION) {
57 // 播放完成 57 // 播放完成
58 58
59 } else { 59 } else {
60 - this.isError = false 60 + this.isPlayerError = false
61 } 61 }
62 62
63 } 63 }
@@ -186,7 +186,7 @@ export struct TopPlayComponent { @@ -186,7 +186,7 @@ export struct TopPlayComponent {
186 onLoad: async () => { 186 onLoad: async () => {
187 if (StringUtils.isNotEmpty(this.playUrl)) { 187 if (StringUtils.isNotEmpty(this.playUrl)) {
188 this.isHideLoading = false 188 this.isHideLoading = false
189 - this.isError = false 189 + this.isPlayerError = false
190 this.xComponentIsLoaded = true 190 this.xComponentIsLoaded = true
191 Logger.debug(TAG, `---onLoad------>`) 191 Logger.debug(TAG, `---onLoad------>`)
192 this.tryToPlay() 192 this.tryToPlay()
@@ -265,12 +265,12 @@ export struct TopPlayComponent { @@ -265,12 +265,12 @@ export struct TopPlayComponent {
265 .padding(0) 265 .padding(0)
266 .onClick(() => { 266 .onClick(() => {
267 this.isHideLoading = false 267 this.isHideLoading = false
268 - this.isError = false 268 + this.isPlayerError = false
269 this.xComponentIsLoaded = true 269 this.xComponentIsLoaded = true
270 this.tryToPlay() 270 this.tryToPlay()
271 271
272 }) 272 })
273 - }.width('100%').visibility(this.isError ? Visibility.Visible : 273 + }.width('100%').visibility(this.isPlayerError ? Visibility.Visible :
274 Visibility.None) 274 Visibility.None)
275 275
276 } 276 }
1 import { ContentDetailDTO } from 'wdBean/Index'; 1 import { ContentDetailDTO } from 'wdBean/Index';
2 -import { AliPlayerRenderView, WDAliPlayerController, WDPlayerRenderVLiveView } from 'wdPlayer/Index'; 2 +import { AliPlayerRenderView, PlayerConstants, WDAliPlayerController, WDPlayerRenderVLiveView } from 'wdPlayer/Index';
3 import { ParamType, TrackConstants } from 'wdTracking/Index'; 3 import { ParamType, TrackConstants } from 'wdTracking/Index';
4 import { PictureLoading } from './PictureLoading'; 4 import { PictureLoading } from './PictureLoading';
5 5
@@ -20,8 +20,10 @@ export struct PlayerComponent { @@ -20,8 +20,10 @@ export struct PlayerComponent {
20 // 0-横屏流画面,1-竖屏幕流画面 20 // 0-横屏流画面,1-竖屏幕流画面
21 @State liveStreamType: number | null = -1 21 @State liveStreamType: number | null = -1
22 @State playUrl: string = '' 22 @State playUrl: string = ''
23 - @State isCanplay: boolean = false  
24 pageParam: ParamType = {} 23 pageParam: ParamType = {}
  24 + // 播放失败
  25 + @Link isPlayerError: boolean
  26 + @Link isCanplay: boolean
25 27
26 pageShowChange() { 28 pageShowChange() {
27 this.playerController?.play() 29 this.playerController?.play()
@@ -31,10 +33,33 @@ export struct PlayerComponent { @@ -31,10 +33,33 @@ export struct PlayerComponent {
31 this.playerController?.pause() 33 this.playerController?.pause()
32 } 34 }
33 35
34 - async aboutToAppear(): Promise<void> { 36 + aboutToAppear(){
  37 +
  38 + if (this.playerController) {
  39 + this.playerController.onCanplay = () => {
  40 + this.isCanplay = true
  41 + this.playerController?.play()
  42 + }
  43 + this.playerController.onStatusChange = (status: number) => {
  44 + if (status === PlayerConstants.STATUS_ERROR) {
  45 + this.isPlayerError = true
  46 + this.isCanplay = true
  47 + } else if (status === PlayerConstants.STATUS_COMPLETION) {
  48 + // 播放完成
  49 +
  50 + } else {
  51 + //this.isPlayerError = false
  52 + }
  53 +
  54 + }
  55 + }
  56 +
  57 +
35 setTimeout(() => { 58 setTimeout(() => {
36 this.updateData() 59 this.updateData()
37 }, 10) 60 }, 10)
  61 +
  62 +
38 } 63 }
39 64
40 async aboutToDisappear(): Promise<void> { 65 async aboutToDisappear(): Promise<void> {
@@ -65,49 +90,41 @@ export struct PlayerComponent { @@ -65,49 +90,41 @@ export struct PlayerComponent {
65 this.liveStreamType = liveStreamType 90 this.liveStreamType = liveStreamType
66 this.playUrl = playUrl 91 this.playUrl = playUrl
67 } 92 }
68 - console.error("XXXXZZZZ", 'updateData ----liveState==>' + this.playUrl)  
69 } 93 }
70 94
71 build() { 95 build() {
72 - Column() {  
73 - Stack() {  
74 - // TODO:判断横竖屏，liveStreamType=1竖屏铺满屏幕,裁剪不拉伸，liveStreamType=0横屏正常展示  
75 - if (this.liveStreamType == null || this.liveStreamType == 1) {  
76 - WDPlayerRenderVLiveView({  
77 - playerController: this.playerController,  
78 - onLoad: () => {  
79 - this.isCanplay = true  
80 - this.contentTrackingDict()  
81 - this.playerController?.firstPlay(this.playUrl, TrackConstants.PageName.Live_Detail, this.pageParam);  
82 - }  
83 - })  
84 - } else if (this.liveStreamType == 0) {  
85 - AliPlayerRenderView({  
86 - playerController: this.playerController,  
87 - onLoad: () => {  
88 - this.isCanplay = true  
89 - this.contentTrackingDict()  
90 - this.playerController?.firstPlay(this.playUrl, TrackConstants.PageName.Live_Detail, this.pageParam);  
91 - }  
92 - }).margin({ top: 195 }).height(211)  
93 - } 96 + Stack() {
  97 + // TODO:判断横竖屏，liveStreamType=1竖屏铺满屏幕,裁剪不拉伸，liveStreamType=0横屏正常展示
  98 + if (this.liveStreamType == null || this.liveStreamType == 1) {
  99 + WDPlayerRenderVLiveView({
  100 + playerController: this.playerController,
  101 + onLoad: () => {
  102 + console.error("XXXXZZZZ", '-------------1--------' + this.playUrl)
  103 + this.isCanplay = true
  104 + this.contentTrackingDict()
  105 + this.playerController?.firstPlay(this.playUrl, TrackConstants.PageName.Live_Detail, this.pageParam);
  106 + }
  107 + })
  108 + } else if (this.liveStreamType == 0) {
  109 + AliPlayerRenderView({
  110 + playerController: this.playerController,
  111 + onLoad: () => {
  112 + this.isCanplay = true
  113 + this.contentTrackingDict()
  114 + this.playerController?.firstPlay(this.playUrl, TrackConstants.PageName.Live_Detail, this.pageParam);
  115 + }
  116 + }).margin({ top: 195 }).height(211)
  117 + }
94 118
95 - PictureLoading().visibility(this.isCanplay ? Visibility.None : Visibility.Visible) 119 + PictureLoading().visibility(this.isCanplay ? Visibility.None : Visibility.Visible)
96 120
97 - }  
98 - .height('100%')  
99 - .width('100%')  
100 - .align(Alignment.Top)  
101 - .alignContent(Alignment.Top)  
102 - .onClick(() => {  
103 - if (this.liveState === 'end') {  
104 - this.isShowControl = !this.isShowControl  
105 - }  
106 - })  
107 121
108 } 122 }
109 .height('100%') 123 .height('100%')
110 .width('100%') 124 .width('100%')
  125 + .align(Alignment.Top)
  126 + .alignContent(Alignment.Top)
  127 +
111 } 128 }
112 129
113 contentTrackingDict() { 130 contentTrackingDict() {