zhenghy

视频首帧图占位,人民日报gif动图

@@ -54,11 +54,11 @@ export struct DetailPlayShortVideoPage { @@ -54,11 +54,11 @@ export struct DetailPlayShortVideoPage {
54 /** 54 /**
55 * 页面显示重查用户关注、点赞等信息 55 * 页面显示重查用户关注、点赞等信息
56 */ 56 */
57 - pageShowChange() { 57 + async pageShowChange() {
58 if (this.currentIndex === this.index) { 58 if (this.currentIndex === this.index) {
59 this.queryNewsInfoOfUser() 59 this.queryNewsInfoOfUser()
60 if (this.switchVideoStatus) { 60 if (this.switchVideoStatus) {
61 - this.playerController.play() 61 + await this.playerController.play()
62 this.imageVisible = false 62 this.imageVisible = false
63 } 63 }
64 } 64 }
@@ -68,10 +68,10 @@ export struct DetailPlayShortVideoPage { @@ -68,10 +68,10 @@ export struct DetailPlayShortVideoPage {
68 * 频道切换视频暂停、播放 68 * 频道切换视频暂停、播放
69 * 页面显隐视频暂停、播放 69 * 页面显隐视频暂停、播放
70 */ 70 */
71 - videoStatusChange() { 71 + async videoStatusChange() {
72 if (this.currentIndex === this.index) { 72 if (this.currentIndex === this.index) {
73 if (this.switchVideoStatus) { 73 if (this.switchVideoStatus) {
74 - this.playerController.play() 74 + await this.playerController.play()
75 this.imageVisible = false 75 this.imageVisible = false
76 } else { 76 } else {
77 this.playerController.pause() 77 this.playerController.pause()
@@ -82,7 +82,7 @@ export struct DetailPlayShortVideoPage { @@ -82,7 +82,7 @@ export struct DetailPlayShortVideoPage {
82 /** 82 /**
83 * 监听下标变化手动创建或销毁视频 83 * 监听下标变化手动创建或销毁视频
84 */ 84 */
85 - currentIndexChange() { 85 + async currentIndexChange() {
86 if (this.currentIndex != this.index) { 86 if (this.currentIndex != this.index) {
87 this.playerController.pause() 87 this.playerController.pause()
88 if (this.index <= this.currentIndex - 2 && this.playerController.getPlayer()) { 88 if (this.index <= this.currentIndex - 2 && this.playerController.getPlayer()) {
@@ -94,7 +94,7 @@ export struct DetailPlayShortVideoPage { @@ -94,7 +94,7 @@ export struct DetailPlayShortVideoPage {
94 if (!this.playerController.getPlayer()) { 94 if (!this.playerController.getPlayer()) {
95 this.playerController.firstPlay(this.contentDetailData?.videoInfo[0]?.videoUrl || ''); 95 this.playerController.firstPlay(this.contentDetailData?.videoInfo[0]?.videoUrl || '');
96 } else { 96 } else {
97 - this.playerController.play() 97 + await this.playerController.play()
98 this.imageVisible = false 98 this.imageVisible = false
99 } 99 }
100 } 100 }
@@ -153,10 +153,10 @@ export struct DetailPlayShortVideoPage { @@ -153,10 +153,10 @@ export struct DetailPlayShortVideoPage {
153 this.videoLandScape = this.contentDetailData.videoInfo[0]?.videoLandScape 153 this.videoLandScape = this.contentDetailData.videoInfo[0]?.videoLandScape
154 this.ratio = this.contentDetailData.videoInfo[0].resolutionWidth / 154 this.ratio = this.contentDetailData.videoInfo[0].resolutionWidth /
155 this.contentDetailData.videoInfo[0].resolutionHeight 155 this.contentDetailData.videoInfo[0].resolutionHeight
156 - this.playerController.onCanplay = () => { 156 + this.playerController.onCanplay = async () => {
157 this.ratio = this.playerController.videoWidth / this.playerController.videoHeight 157 this.ratio = this.playerController.videoWidth / this.playerController.videoHeight
158 if ((this.index == 0 || this.currentIndex === this.index) && this.switchVideoStatus) { 158 if ((this.index == 0 || this.currentIndex === this.index) && this.switchVideoStatus) {
159 - this.playerController.play() 159 + await this.playerController.play()
160 this.imageVisible = false 160 this.imageVisible = false
161 } 161 }
162 } 162 }
@@ -186,7 +186,7 @@ export struct DetailPlayShortVideoPage { @@ -186,7 +186,7 @@ export struct DetailPlayShortVideoPage {
186 Stack({ alignContent: Alignment.Top }) { 186 Stack({ alignContent: Alignment.Top }) {
187 Column() { 187 Column() {
188 Stack() { 188 Stack() {
189 - // this.playerCoverBuilder() 189 +
190 this.playerViewBuilder() 190 this.playerViewBuilder()
191 191
192 PlayerBottomView({ 192 PlayerBottomView({
@@ -243,16 +243,14 @@ export struct DetailPlayShortVideoPage { @@ -243,16 +243,14 @@ export struct DetailPlayShortVideoPage {
243 */ 243 */
244 @Builder 244 @Builder
245 playerCoverBuilder() { 245 playerCoverBuilder() {
  246 + // 问题:画面会闪一下
246 Image(this.contentDetailData?.firstFrameImageUri) 247 Image(this.contentDetailData?.firstFrameImageUri)
247 .width('100%') 248 .width('100%')
248 - .padding({  
249 - bottom: this.videoLandScape === 1 ? 115 : 0,  
250 - })// .align(this.videoLandScape === 0 ? Alignment.Top : Alignment.Center)  
251 - .fitOriginalSize(true)  
252 - .autoResize(true)  
253 - .position({ x: 0, y: this.videoLandScape === 0 ? 0 : '50%' })  
254 - .markAnchor({ y: this.videoLandScape === 0 ? 0 : '50%' })  
255 - // .visibility(this.imageVisible ? Visibility.Visible : Visibility.None) 249 + .height(this.windowWidth / this.ratio + 'px')
  250 + .opacity(this.imageVisible ? 1 : 0)
  251 + .animation({
  252 + duration: 500, curve: Curve.EaseInOut
  253 + })
256 } 254 }
257 255
258 @Builder 256 @Builder
@@ -269,6 +267,8 @@ export struct DetailPlayShortVideoPage { @@ -269,6 +267,8 @@ export struct DetailPlayShortVideoPage {
269 .width('100%') 267 .width('100%')
270 .height(this.windowWidth / this.ratio + 'px') 268 .height(this.windowWidth / this.ratio + 'px')
271 269
  270 + this.playerCoverBuilder()
  271 +
272 // .height(this.displayDirection === DisplayDirection.VIDEO_HORIZONTAL ? '100%' : 272 // .height(this.displayDirection === DisplayDirection.VIDEO_HORIZONTAL ? '100%' :
273 // this.videoLandScape === 1 ? 210 : 'auto')// .height(this.videoLandScape === 1 ? 210 : '100%') 273 // this.videoLandScape === 1 ? 210 : 'auto')// .height(this.videoLandScape === 1 ? 210 : '100%')
274 // .width(this.videoLandScape === 1 ? 274 // .width(this.videoLandScape === 1 ?
@@ -16,7 +16,7 @@ export struct PictureLoading { @@ -16,7 +16,7 @@ export struct PictureLoading {
16 build() { 16 build() {
17 Row() { 17 Row() {
18 Image(this.imagePath) 18 Image(this.imagePath)
19 - .alt($r('app.media.picture_loading')) 19 + .alt($r('app.media.datail_imageLoading_w'))
20 .width(this.imageWidth) 20 .width(this.imageWidth)
21 .aspectRatio(this.ratio) 21 .aspectRatio(this.ratio)
22 .objectFit(ImageFit.Fill) 22 .objectFit(ImageFit.Fill)
@@ -254,7 +254,8 @@ export struct VideoChannelDetail { @@ -254,7 +254,8 @@ export struct VideoChannelDetail {
254 }) 254 })
255 } else { 255 } else {
256 256
257 - PictureLoading().visibility(this.isMouted ? Visibility.None : Visibility.Visible) 257 + PictureLoading()
  258 + .visibility(this.isMouted ? Visibility.None : Visibility.Visible)
258 Swiper(this.swiperController) { 259 Swiper(this.swiperController) {
259 ForEach(this.data, (item: ContentDetailDTO, index: number) => { 260 ForEach(this.data, (item: ContentDetailDTO, index: number) => {
260 Column() { 261 Column() {