鸿蒙跨平台框架ArkUI-X 小试牛刀视频播放

前言:

之前有写过arkui-x 跨平台框架可以 同时运行在安卓 iOS 鸿蒙3个平台 今天小试牛刀看看在安卓iOS上面播放视频是什么效果

效果图

ArkUI-X 环境搭建

环境搭建

具体实现

准备资源

具体index代码

less 复制代码
@Entry
@Component
struct Index {
  @Styles
  customMargin() {
    .margin({ left: 20, right: 20 })
  }

  @State message: string = 'Hello World'
  private controller: VideoController = new VideoController();
  build() {
    Row() {
      Column() {
        Video({
          src: $rawfile('video1.mp4'),
          previewUri: $r('app.media.image3'),
          controller: this.controller
        })
          .muted(false) //是否静音。默认值:false
          .controls(true)//不显示控制栏
          .autoPlay(false) // 手动点击播放
          .loop(false) // 关闭循环播放
          .objectFit(ImageFit.Cover) //设置视频显示模式。默认值:Cover
          .customMargin()// 样式
          .height(200) // 高度
      }
      .width('100%')
    }
    .height('100%')
  }
}

预览效果

编译项目

编译完成

找到 arkui-x目录下面的Android目录

导入as

构建项目

修改as插件版本

修改Java版本

连接手机运行 效果

看包里面内容 在 LibChecker 中也可以看到该 APP 使用了 ArkUI 的依赖:

最后总结

鸿蒙的 ArkUi-X其实之前朋友就有提到过 一直没有去尝试,国庆放长假期回来我觉得有必要分享给大家,在这里我也希望鸿蒙能够崛起 这样也可以给我们开发者创造出更多的岗位 至于这个语言arkts 算是ts超集, 前端的同学比较容易上手跟flutter也比较像 学起来也没什么难度。ArkTS + ArkUI-X ,让国产自研技术达到了一个新高度,完成了从零到一的迈步,让自研不再是 PPT ,不再是"套壳"。最后呢 希望我都文章能帮助到各位同学工作和学习 如果你觉得文章还不错麻烦给我三连 关注点赞和转发 谢谢

相关推荐
百万蹄蹄向前冲2 小时前
风扇转了一晚上MVP专家团翻车事故
前端·人工智能
默_笙2 小时前
🏛 给 AI 配一间办公室:Harness Engineering 六大模块与它的实现
前端·javascript
linux_cfan3 小时前
videojs v10 源代码系列解读:14 · 谓词守卫:在运行时安全地调用能力
前端·javascript·音视频
kyriewen3 小时前
我扒了 10,221 条 JD:腾讯技术岗 75% 在要 AI
前端·人工智能·ai编程
郑州光合科技余经理4 小时前
同城外卖小程序开发:下单成功后,后台导出能不能对上用户端状态
开发语言·前端·git·后端·uni-app·php·ai编程
IT_陈寒5 小时前
Vue的响应式让我熬到凌晨三点,原来漏了这个小细节
前端·人工智能·后端
Blanche15005 小时前
利用 RAG 为答疑机器人扩展知识范围
前端
天若有情6735 小时前
【纯前端小工具】公历生日转农历,批量查询每年农历生日对应的公历日期(GitHub Pages在线直接用)
前端·javascript·github pages·农历转换·lunisolar·网页小工具
SoonITer5 小时前
怎样构建一个 Agent-friendly 的网站
前端·agent
颜进强5 小时前
01 · NestJS 是什么:用途、解决什么问题、与热门框架对比
前端·后端·ai编程