Harmony(鸿蒙)开发之视频播放器组件（video）的简单使用

最新推荐文章于 2024-10-12 11:00:43 发布

Andy醒

最新推荐文章于 2024-10-12 11:00:43 发布

阅读量249

点赞数 1

分类专栏： HarmonyOS 鸿蒙os开发文章标签：音视频 harmonyos 鸿蒙华为

本文链接：https://blog.csdn.net/qq_28189091/article/details/141672730

版权

鸿蒙os开发同时被 2 个专栏收录

13 篇文章 0 订阅

订阅专栏

HarmonyOS

10 篇文章 0 订阅

订阅专栏

效果图：

开发环境：

DevEco Studio NEXT Developer Beta1

api 12

步骤一

1，添加网络权限：

ohos.permission.INTERNET

步骤二

@Entry
@Component
struct videoPage {

  @State videoUrl: string = "https://media.w3.org/2010/05/sintel/trailer.mp4"

  @State videoSrc: Resource = $rawfile('VID_20240828_162436.mp4')

  private controller: VideoController = new VideoController();

  @Styles
  customStyles() {
    .margin({ left: 20, right: 20 })
  }

  build() {
    Row() {
      Column() {
        Video({
          src:this.videoUrl,
          previewUri: $r('app.media.app_icon'),
          controller: this.controller
        })
          .muted(false) //是否静音。默认值：false
          .controls(true)//不显示控制栏
          .autoPlay(false) // 手动点击播放
          .loop(false) // 关闭循环播放
          .objectFit(ImageFit.Cover) //设置视频显示模式。默认值：Cover
          .customStyles()// 样式
          .height(200) // 高度
      }
      .width('100%')
    }
    .height('100%')
  }

}