目录

实例代码：

成果展示：

实例代码：

@Entry
@Component
struct Index {
  private videoSrc: VideoController = new VideoController()
  build() {
    Column() {
      Text("本地视频播放器")
        .fontSize(24)
        .width("100%")
        .textAlign(TextAlign.Center)
      Video({
        src: $rawfile("xc.mp4"),
        controller: this.videoSrc,
        previewUri: $r('app.media.background')
      })
        .width("100%")
        .height(220)
        .controls(false)
        .autoPlay(false)
        .loop(true)
        .muted(false)
        .objectFit(ImageFit.Contain)
      Row({ space: 30 }) {
        Button("播放")
          .onClick(() => {
            this.videoSrc.start()
          })
        Button("暂停")
          .onClick(() => {
            this.videoSrc.pause()
          })
      }
    }.padding(15)
  }
}

成果展示：

• src:$rawfile("文件名") $rawfile() 资源读取语法，读取resources/rawfile目录下的视频文件。
• controller：绑定提前定义的视频控制器，实现代码控制视频。
• previewUri:$r('app.media.图片名') $r() 读取 media 目录图片，作为视频未播放时的封面图。
• .width("100%")：视频宽度占满父容器

• .height(220)：视频固定高度
• .controls(false)：隐藏系统自带播放控制栏，true 则显示
• .autoPlay(false)：页面加载完成不自动播放
• .loop(true)：视频播放结束后循环重播
• .muted(false)：关闭静音，正常播放音频
• .objectFit(ImageFit.Contain)：完整保留视频原始比例，画面全部显示不裁剪拉伸