HarmonyOS鸿蒙Next中Video组件的核心功能有哪些?

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

HarmonyOS鸿蒙Next中Video组件的核心功能有哪些? Video组件的核心功能有哪些?

除了播放、暂停和停止,鸿蒙的Video组件还支持哪些其他视频播放控制功能?比如如何设置音量、播放速度等?

4 回复

video组件暂不支持调节音频流音量,建议您使用AVPlayerr或AudioRenderer来进行视频播放的开发。AVPlayer或AudioRenderer可以通过setVolume()方法调节音量。

音量调节可以参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/volume-management-0000001820999933

自定义手势相关文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references/ts-gesture-customize-judge-0000001862607385

AVPlayer的示例文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/video-playback-0000001774120630

系统音量是无法通过三方应用调节的。Video组件暂无支持计划,Video组件相对扩展能力较弱,建议先使用功能较完善的AVPlayer进行视频的开发。

更多关于HarmonyOS鸿蒙Next中Video组件的核心功能有哪些?的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


您好!

Video组件的基础用法,包括控制栏、预览图、自动播放、播放速度、控制器(开始播放、暂停播放、停止播放、重置avPlayer、跳转等)以及一些状态回调方法。

您可以参考以下demo

该组件的使用文档:[https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V13/ts-media-components-video-V13](https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V13/ts-media-components-video-V13)

```javascript
// xxx.ets
[@Entry](/user/Entry)
[@Component](/user/Component)
struct VideoCreateComponent {
  [@State](/user/State) videoSrc: Resource = $rawfile('video1.mp4')
  [@State](/user/State) previewUri: Resource = $r('app.media.poster1')
  [@State](/user/State) curRate: PlaybackSpeed = PlaybackSpeed.Speed_Forward_1_00_X
  [@State](/user/State) isAutoPlay: boolean = false
  [@State](/user/State) showControls: boolean = true
  controller: VideoController = new VideoController()

  build() {
    Column() {
      Video({
        src: this.videoSrc,
        previewUri: this.previewUri,
        currentProgressRate: this.curRate,
        controller: this.controller
      })
        .width('100%')
        .height(600)
        .autoPlay(this.isAutoPlay)
        .controls(this.showControls)
        .onStart(() => {
          console.info('onStart')
        })
        .onPause(() => {
          console.info('onPause')
        })
        .onFinish(() => {
          console.info('onFinish')
        })
        .onError(() => {
          console.info('onError')
        })
        .onStop(() => {
          console.info('onStop')
        })
        .onPrepared((e?: DurationObject) => {
          if (e != undefined) {
            console.info('onPrepared is ' + e.duration)
          }
        })
        .onSeeking((e?: TimeObject) => {
          if (e != undefined) {
            console.info('onSeeking is ' + e.time)
          }
        })
        .onSeeked((e?: TimeObject) => {
          if (e != undefined) {
            console.info('onSeeked is ' + e.time)
          }
        })
        .onUpdate((e?: TimeObject) => {
          if (e != undefined) {
            console.info('onUpdate is ' + e.time)
          }
        })

      Row() {
        Button('src').onClick(() => {
          this.videoSrc = $rawfile('video2.mp4') // 切换视频源
        }).margin(5)
        Button('previewUri').onClick(() => {
          this.previewUri = $r('app.media.poster2') // 切换视频预览海报
        }).margin(5)
        Button('controls').onClick(() => {
          this.showControls = !this.showControls // 切换是否显示视频控制栏
        }).margin(5)
      }

      Row() {
        Button('start').onClick(() => {
          this.controller.start() // 开始播放
        }).margin(2)
        Button('pause').onClick(() => {
          this.controller.pause() // 暂停播放
        }).margin(2)
        Button('stop').onClick(() => {
          this.controller.stop() // 结束播放
        }).margin(2)
        Button('reset').onClick(() => {
          this.controller.reset() // 重置AVPlayer
        }).margin(2)
        Button('setTime').onClick(() => {
          this.controller.setCurrentTime(10, SeekMode.Accurate) // 精准跳转到视频的10s位置
        }).margin(2)
      }

      Row() {
        Button('rate 0.75').onClick(() => {
          this.curRate = PlaybackSpeed.Speed_Forward_0_75_X // 0.75倍速播放
        }).margin(5)
        Button('rate 1').onClick(() => {
          this.curRate = PlaybackSpeed.Speed_Forward_1_00_X // 原倍速播放
        }).margin(5)
        Button('rate 2').onClick(() => {
          this.curRate = PlaybackSpeed.Speed_Forward_2_00_X // 2倍速播放
        }).margin(5)
      }
    }
  }
}

interface DurationObject {
  duration: number;
}

interface TimeObject {
  time: number;
}

在HarmonyOS鸿蒙Next中,Video组件的核心功能主要包括以下几个方面:

  1. 视频播放:支持播放本地和网络视频文件,格式包括MP4、WebM等常见格式。
  2. 播放控制:提供播放、暂停、停止、快进、快退等基本控制功能。
  3. 全屏播放:支持全屏模式播放,提升观看体验。
  4. 音量控制:支持音量调节和静音功能。
  5. 进度条:显示视频播放进度,允许用户拖动进度条进行跳转。
  6. 缓冲管理:自动处理视频缓冲,优化播放流畅度。
  7. 事件回调:支持播放、暂停、结束等事件回调,便于开发者进行业务逻辑处理。
  8. 多实例支持:支持多个Video组件同时播放不同视频。
  9. 画质切换:支持不同画质(如标清、高清)的切换。
  10. 字幕支持:支持加载和显示字幕文件,格式包括SRT、VTT等。
  11. 封面图:支持在视频加载前显示封面图。
  12. 循环播放:支持设置循环播放模式。

这些功能使得Video组件在HarmonyOS鸿蒙Next中能够满足多样化的视频播放需求。

在HarmonyOS鸿蒙Next中,Video组件的核心功能包括:

  • 视频播放控制(播放、暂停、停止、快进、快退等)
  • 视频源加载(支持本地和网络视频)
  • 播放进度管理(进度条、时间显示)
  • 全屏播放支持
  • 音量控制
  • 播放状态监听(如缓冲、播放完成等事件)
  • 多格式支持(如MP4、HLS等)

这些功能为开发者提供了灵活的视频播放解决方案。

回到顶部
AI 助手
你好,我是IT营的 AI 助手
您可以尝试点击下方的快捷入口开启体验!