当前位置: 首页 > news >正文

【HarmonyOS】鸿蒙开发之Video组件——第3.7章

Video组件内VideoOptions属性简介

  • src:设置视频地址。
  • currentProgressRate:设置视频播放倍速,参数说明如下:
    • number|string:只支持 0.75 , 1.0 , 1.25 , 1.75 , 2.0 。
    • PlaybackSpeed:对 number | string 的封装,防止用户传错参数的。
  • previewUri:视频封面图的路径。
  • controller:设置视频播放的控制器,比如控制视频开始,暂停等。

代码实例:

// Web控制器private videoController: VideoController = new VideoController()build(){Column(){Video({src: $r("app.media.test"),             // 设置数据源previewUri: "https://tenfei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg",     // 设置封面图片controller: this.videoController      // 设置控制器}).width(300).height(210)Row({space: 10}) {Button("播放").onClick(() => {this.videoController.start()})Button("暂停").onClick(() => {this.videoController.pause()})Button("继续").onClick(() => {this.videoController.start()})}.margin({bottom:10,top:10})Row() {Button("全屏").onClick(() => {this.videoController.requestFullscreen(true)})Button("退出全屏").onClick(() => {this.videoController.exitFullscreen()})}}.justifyContent(FlexAlign.Center).width("100%").height("100%")}

Video组件事件介绍

//播放视频
onStart(event: () => void): VideoAttribute;
//暂停视频
onPause(event: () => void): VideoAttribute;
//视频完成时触发
onFinish(event: () => void): VideoAttribute;
//在全屏播放与非全屏播放状态之间切换时触发该事件
onFullscreenChange(callback: (event?: { fullscreen: boolean }) => void): VideoAttribute;
//视频准备完成时触发该事件,通过duration可以获取视频时长,单位为s
onPrepared(callback: (event?: { duration: number }) => void): VideoAttribute;
//当用户开始移动/跳到音频/视频中的新位置时
onSeeking(callback: (event?: { time: number }) => void): VideoAttribute;
//当用户重新定位视频的播放位置后执行
onSeeked(callback: (event?: { time: number }) => void): VideoAttribute;
//播放进度变化时触发该事件,单位为s,更新时间间隔为250ms
onUpdate(callback: (event?: { time: number }) => void): VideoAttribute;
//播放失败时触发该事件
onError(event: () => void): VideoAttribute;

代码实例

 Video({...}).onUpdate((event) => {this.currentTime = event.time;this.currentStringTime = this.handleChangeSliderTime(this.currentTime); //更新事件}).onPrepared((event) => {console.log("视频时长:"+event.duration);}).onError(() => {promptAction.showToast({duration: 2000, //播放失败事件message: "播放失败"});}).width(300).height(210)

注意:如果视频播放路径为第三方链接,需要开启网络权限。如图:
在这里插入图片描述

踩坑不易,还希望各位大佬支持一下 \textcolor{gray}{踩坑不易,还希望各位大佬支持一下} 踩坑不易,还希望各位大佬支持一下

📃 个人主页: \textcolor{green}{个人主页:} 个人主页: 沉默小管

📃 个人网站: \textcolor{green}{个人网站:} 个人网站: 沉默小管

📃 个人导航网站: \textcolor{green}{个人导航网站:} 个人导航网站: 沉默小管导航网

📃 我的开源项目: \textcolor{green}{我的开源项目:} 我的开源项目: vueCms.cn

🔥 技术交流 Q Q 群: 837051545 \textcolor{green}{技术交流QQ群:837051545} 技术交流QQ群:837051545

👍 点赞,你的认可是我创作的动力! \textcolor{green}{点赞,你的认可是我创作的动力!} 点赞,你的认可是我创作的动力!

⭐️ 收藏,你的青睐是我努力的方向! \textcolor{green}{收藏,你的青睐是我努力的方向!} 收藏,你的青睐是我努力的方向!

✏️ 评论,你的意见是我进步的财富! \textcolor{green}{评论,你的意见是我进步的财富!} 评论,你的意见是我进步的财富!

如果有不懂可以留言,我看到了应该会回复
如有错误,请多多指教

相关文章:

【HarmonyOS】鸿蒙开发之Video组件——第3.7章

Video组件内VideoOptions属性简介 src:设置视频地址。currentProgressRate:设置视频播放倍速,参数说明如下: number|string:只支持 0.75 , 1.0 , 1.25 , 1.75 , 2.0 。P…...

React引入css的几种方式以及应用

1.直接引入css文件 import "./parent.css" 2.引入css模块,定义文件名[组件名.module.css];该方式可避免类名的重复,每个组件都有独立的作用域,避免了全局污染,保证了类名的唯一性 import styles from &qu…...

[算法沉淀记录] 排序算法 —— 冒泡排序

排序算法 —— 冒泡排序 基本概念 冒泡排序是一种简单的排序算法。它重复地遍历要排序的列表,一次比较两个元素,并交换它们的位置,如果它们不是按照升序排列的。这步遍历是重复进行的,直到没有再需要交换,也就是说该…...

【机器人最短路径规划问题(栅格地图)】基于遗传算法求解

基于遗传算法求解机器人最短路径规划问题(栅格地图)的仿真结果 仿真结果: 路径长度的变化曲线: 遗传算法优化后的机器人避障路径:...

如何做代币分析:以 TRX 币为例

作者:lesleyfootprint.network 编译:cicifootprint.network 数据源:TRX 代币仪表板 (仅包括以太坊数据) 在加密货币和数字资产领域,代币分析起着至关重要的作用。代币分析指的是深入研究与代币相关的数据…...

关于地址引用与值引用的坑

List<UserInfo> userInfoList new List<UserInfo>(); List<UserInfo> userInfoList_new new List<UserInfo>(userInfoList);userInfoList_new 与userInfoList 指的是相同的内存吗&#xff1f; 答&#xff1a; 在C#中&#xff0c;userInfoList_new …...

初谈软件工程(一)

我就读于兰州交通大学的软件工程专业。虽然在全国众多的985、211高校中&#xff0c;兰州交通大学可能并不显眼&#xff0c;似乎未能跻身这些所谓的“顶尖”行列就意味着不被认可。然而&#xff0c;在甘肃省的教育领域中&#xff0c;它无疑是一座璀璨的明珠&#xff0c;名列前茅…...

自动化开展思路

自动化开展思路 本人在公司一直从事自动化测试推进工作&#xff0c;最近在好友的邀请下去其就职的公司分享如何开展自动化测试&#xff01; 希望能帮其解决如下几个痛点&#xff1a; 1.上线周期长&#xff1b; 2.测试时间紧张&#xff0c;上线信心不足&#xff0c;测试覆盖…...

安装使用zookeeper

先去官网下载zookeeper&#xff1a;Apache ZooKeeper 直接进入bin目录&#xff0c;使用powerShell打开。 输入: ./zkServer.cmd 命令&#xff0c;启动zookeeper。 zookeeper一般需要配合Dubbo一起使用&#xff0c;作为注册中心使用&#xff0c;可以参考另一篇博客&#xf…...

nginx实现http反向代理及负载均衡

目录 一、代理概述 1、代理概念 1.1 正向代理&#xff08;Forward Proxy&#xff09; 1.2 反向代理&#xff08;Reverse Proxy&#xff09; 1.3 正向代理与反向代理的区别 2、同构代理与异构代理 2.1 同构代理 2.2 异构代理 2.3 同构代理与异构代理的区别 二、四层代…...

vue组件中data为什么必须是一个函数

查看本专栏目录 关于作者 还是大剑师兰特&#xff1a;曾是美国某知名大学计算机专业研究生&#xff0c;现为航空航海领域高级前端工程师&#xff1b;CSDN知名博主&#xff0c;GIS领域优质创作者&#xff0c;深耕openlayers、leaflet、mapbox、cesium&#xff0c;canvas&#x…...

科技论文编写思路

科技论文编写思路 1.基本框架2.课题可行性评估1.研究目标和意义2.研究方法和技术3.可行性和可操作性4.风险和不确定性5.经济性和资源投入6.成果预期和评估 3.写作思路4.利用AI读论文5.实验流程 1.基本框架 IntroductionRelated worksMethodExperiment and analysisDiscussionC…...

Windows虚拟机克隆后修改SID

在日常使用VMware Workstation我们经常会去克隆一些Windows操作系统的虚拟机&#xff0c;克隆的虚拟机和源虚拟机的系统安全标识符&#xff08;Security Identifiers&#xff0c;SID&#xff09;相同&#xff0c;SID是标识用户、组和计算机账户的唯一的号码。 如果两台虚拟机都…...

前端架构: 脚手架工具rxjs的快速上手应用

rxjs rxjs 是一个异步的库和Promise是非常的相似 文档&#xff1a;https://www.npmjs.com/package/rxjs Weekly Downloads 44,474,389 (动态数据) 说明这个库也是非常的流行 安装 $ npm i -S rxjs 使用 import { range, filter, map } from rxjs;range(1, 200).pipe(filte…...

小程序框架(概念、工作原理、发展及应用)

引言 移动应用的普及使得用户对于轻量级、即时可用的应用程序需求越来越迫切。在这个背景下&#xff0c;小程序应运而生&#xff0c;成为一种无需下载安装、即点即用的应用形式&#xff0c;为用户提供了更便捷的体验。小程序的快速发展离不开强大的开发支持&#xff0c;而小程…...

音视频数字化(数字与模拟-电影)

针对电视屏幕,电影被称为“大荧幕”,也是娱乐行业的顶尖产业。作为一项综合艺术,从被发明至今,近200年的发展史中,无人可以替代,并始终走在时代的前列。 电影回放的原理就是“视觉残留”,也就是快速移过眼前的画面,会在人的大脑中残留短暂的时间,随着画面不断地移过,…...

在 Ubuntu 中, 使用 fsck 命令来修复磁盘文件系统

在 Ubuntu 中&#xff0c;可以使用 fsck 命令来修复磁盘文件系统。fsck 是用于检查和修复文件系统的工具。 使用 fsck 命令修复磁盘文件系统的步骤如下&#xff1a; 首先&#xff0c;您需要在命令行终端窗口中以 root 用户身份登录。 使用 fdisk -l 命令列出所有磁盘设备。 …...

LED电子显示屏连接方式解析

LED电子显示屏作为现代化数字展示设备的重要组成部分&#xff0c;其连接方式对于显示效果和稳定性至关重要。正确选择和实施连接方式不仅可以确保LED显示屏系统的正常运行&#xff0c;还可以提高其可靠性和持久性。本文将介绍LED电子显示屏常见的连接方式&#xff0c;以帮助读者…...

Mysql运维篇(五) 部署MHA--主机环境配置

一路走来&#xff0c;所有遇到的人&#xff0c;帮助过我的、伤害过我的都是朋友&#xff0c;没有一个是敌人。如有侵权&#xff0c;请留言&#xff0c;我及时删除&#xff01; 大佬博文 https://www.cnblogs.com/gomysql/p/3675429.html MySQL 高可用&#xff08;MHA&#x…...

Offer必备算法09_分治快排_四道力扣OJ(快排三路划分)

目录 分治快排算法原理 ①力扣75. 颜色分类 解析代码 ②力扣912. 排序数组 解析代码 ③力扣215. 数组中的第K个最大元素 解析代码 ④力扣LCR 159. 库存管理 III&#xff08;剑指 Offer . 最小的k个数&#xff09; 解析代码 本篇完。 分治快排算法原理 分治就是分而治…...

3个步骤让MedSAM医疗影像分割模型成为你的AI诊断助手

3个步骤让MedSAM医疗影像分割模型成为你的AI诊断助手 【免费下载链接】MedSAM Segment Anything in Medical Images 项目地址: https://gitcode.com/gh_mirrors/me/MedSAM 你是一名放射科医生&#xff0c;面对堆积如山的CT扫描图像&#xff0c;需要快速准确地标注出肿瘤…...

游戏开发新思路:用SDF实现超低开销的软阴影与AO(以Bunny模型为例)

游戏开发新思路&#xff1a;用SDF实现超低开销的软阴影与AO&#xff08;以Bunny模型为例&#xff09; 在独立游戏开发中&#xff0c;画面表现与性能开销往往难以兼得。传统阴影和环境光遮蔽&#xff08;AO&#xff09;方案如Shadow Map和SSAO虽然效果尚可&#xff0c;但对硬件资…...

独立游戏开发者的音频救星:零代码用FMOD为Unity游戏添加动态背景音乐与交互音效

独立游戏开发者的音频救星&#xff1a;零代码用FMOD为Unity游戏添加动态背景音乐与交互音效 当你在深夜调试游戏时&#xff0c;是否曾被突如其来的静默打断沉浸感&#xff1f;或是发现精心设计的战斗场景因为单调重复的背景音乐而失去张力&#xff1f;作为独立开发者&#xff…...

Unity 引擎中的 RuntimeInitializeOnLoadMethod 属性解析

在 Unity 游戏开发中,有许多细微但非常重要的特性,其中之一就是 RuntimeInitializeOnLoadMethod 属性。这篇博文将详细探讨这个属性的工作原理,并结合实例解释其在实际开发中的应用。 背景介绍 Unity 引擎虽然主要使用 C# 进行开发,但其核心是基于 C 和 C++ 构建的。这意…...

小白程序员必看!收藏这份AI大模型学习进阶指南,轻松入行!

本文针对AI大趋势下&#xff0c;大学生如何快速进入AI领域的问题&#xff0c;提出解决方案。文章从专业背景出发&#xff0c;将学生分为技术背景和非技术背景两类&#xff0c;并分别给出适合的AI岗位选择&#xff0c;如算法工程师、AI产品经理等。随后&#xff0c;针对技术岗和…...

Mac与Windows局域网通信障碍?飞秋Mac版让你无缝连接同事电脑

Mac与Windows局域网通信障碍&#xff1f;飞秋Mac版让你无缝连接同事电脑 【免费下载链接】feiq 基于qt实现的mac版飞秋&#xff0c;遵循飞秋协议(飞鸽扩展协议)&#xff0c;支持多项飞秋特有功能 项目地址: https://gitcode.com/gh_mirrors/fe/feiq 还在为Mac电脑无法与…...

从Calculator到真实业务:在IDEA里用JUnit4给Maven项目做单元测试的完整实践(附源码)

从Calculator到真实业务&#xff1a;在IDEA里用JUnit4给Maven项目做单元测试的完整实践 单元测试是保证代码质量的重要手段&#xff0c;但很多开发者在从简单的Calculator示例转向真实业务代码测试时&#xff0c;常常感到无从下手。本文将带你跨越这道鸿沟&#xff0c;通过一个…...

如何解锁中兴光猫工厂模式:zteOnu工具实战完整指南

如何解锁中兴光猫工厂模式&#xff1a;zteOnu工具实战完整指南 【免费下载链接】zteOnu A tool that can open ZTE onu device factory mode 项目地址: https://gitcode.com/gh_mirrors/zt/zteOnu 中兴光猫&#xff08;ONU&#xff09;设备通常限制普通用户访问高级配置…...

别再傻傻用pip了!用Anaconda的conda管理Python环境,效率提升不止一点点

从pip到conda&#xff1a;Python环境管理的效率革命 在Python开发的世界里&#xff0c;环境管理一直是个让人头疼的问题。想象一下这样的场景&#xff1a;你正在开发一个新项目&#xff0c;需要特定版本的NumPy和Pandas&#xff0c;但你的另一个项目却依赖这些库的不同版本。传…...

免费获取VMware Workstation Pro 17许可证密钥的终极指南:5000+密钥任你选!

免费获取VMware Workstation Pro 17许可证密钥的终极指南&#xff1a;5000密钥任你选&#xff01; 【免费下载链接】VMware-Workstation-Pro-17-Licence-Keys Free VMware Workstation Pro 17 full license keys. Weve meticulously organized thousands of keys, catering to …...