HarmonyOS 鸿蒙Next Swiper组件是否支持子组件为Video组件,并且可以自动播放

发布于 1周前 作者 vueper 来自 鸿蒙OS

HarmonyOS 鸿蒙Next Swiper组件是否支持子组件为Video组件,并且可以自动播放 Swiper组件是否支持子组件为Video组件,并且可以自动播放

3 回复

Swiper组件支持子组件为Video组件以及自动播放。

可以参考这个demo:

@Entry
@Component
struct VideoCreateComponent {
  @State videoSrc: Resource = $rawfile('video1.mp4')
  @State previewUri: Resource = $rawfile('video2.mp4')
  @State curRate: PlaybackSpeed = PlaybackSpeed.Speed_Forward_1_00_X
  @State isAutoPlay: boolean = true
  @State showControls: boolean = true
  controller: VideoController = new VideoController()
  private swiperController: SwiperController = new SwiperController()

  build() {
    Column() {
      Swiper(this.swiperController) {
        Video({
          src: this.videoSrc,
          previewUri: this.previewUri,
          currentProgressRate: this.curRate,
          controller: this.controller
        })
          .width('100%')
          .height(300)
          .autoPlay(this.isAutoPlay)
          .controls(this.showControls)
          .loop(true)

        Video({
          src: this.previewUri,
          previewUri: this.videoSrc,
          currentProgressRate: this.curRate,
          controller: this.controller
        })
          .width('100%')
          .height(300)
          .autoPlay(this.isAutoPlay)
          .controls(this.showControls)
          .loop(true)
      }
    }
  }
}

更多关于HarmonyOS 鸿蒙Next Swiper组件是否支持子组件为Video组件,并且可以自动播放的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


支持 自动播放是video组件控制的 和Swiper没关系

HarmonyOS 鸿蒙Next Swiper组件支持子组件为Video组件,但自动播放功能受限

在HarmonyOS的Next Swiper组件中,确实可以容纳Video组件作为其子组件。这种设计允许开发者在滑动视图(Swiper)中嵌入视频内容,为用户提供更丰富的交互体验。

然而,关于自动播放功能,需要特别注意。由于系统安全和用户体验的考虑,大多数操作系统(包括HarmonyOS)对视频自动播放有一定的限制。特别是在移动设备上,自动播放视频可能会消耗大量流量和电池,且可能干扰用户的正常使用。因此,即使Video组件被嵌入到Swiper中,也不一定能实现自动播放,这取决于系统的具体策略和用户设备的设置。

开发者在实现这一功能时,可能需要引导用户进行手动操作以触发视频播放,或者通过系统提供的API检查自动播放是否被允许,并据此调整播放逻辑。

如果开发者在尝试集成Video组件并实现自动播放功能时遇到问题,建议详细阅读HarmonyOS的官方文档,了解相关组件的特性和限制。同时,也可以考虑通过事件监听和用户交互设计来优化视频播放体验。

如果问题依旧没法解决请联系官网客服,官网地址是:

https://www.itying.com/category-93-b0.html

回到顶部