HarmonyOS7 音视频播放：AVPlayer 实战-北京尧图网络

文章目录前言AVPlayer 是什么代码实现画面载体XComponent核心代码播放控制完整示例完整播放器骨架常见误区小白必踩完整可运行示例AVPlayer 播音频代码解析写在最后前言做个能播放音视频的 app听起来高大上其实 HarmonyOS 已经把最难的编解码封装好了你只要学会AVPlayer这个播放器对象怎么用就行。这篇文章我带你实现一个播放/暂停/进度俱全的本地视频播放器。网络视频套路一样只是地址不同。AVPlayer 是什么AVPlayer是系统提供的多媒体播放器负责拿到资源 → 解码 → 输出到界面。你不用懂编解码只要设置数据源、准备、播放、控制。代码实现import{media}fromkit.MediaKitletplayer:media.AVPlayerasyncfunctioninitPlayer(surfaceId:string,url:string){playerawaitmedia.createAVPlayer()player.urlurl// 设置播放地址player.surfaceIdsurfaceId// 绑定到 XComponent 的渲染表面}要点createAVPlayer()异步创建播放器。player.url本地或网络媒体地址。player.surfaceId播放画面要贴在哪个渲染表面上这个表面由XComponent提供见下。画面载体XComponent视频画面不能直接用普通组件显示得用XComponent提供一块原生渲染表面核心代码LocalsurfaceId:stringbuild(){Column(){XComponent({id:video,type:XComponentType.SURFACE,controller:this.xcCtrl}).onLoad((surfaceId:string){this.surfaceIdsurfaceId// 拿到表面 id}).width(100%).height(240)}}XComponent的onLoad回调会给你一个surfaceId把它存起来传给player.surfaceId画面就出来了。必须先有surfaceId才能初始化播放器——所以初始化要等onLoad之后。播放控制播放器有几个核心状态控制就围绕它们完整示例functionplay(){player.play()}// 播放functionpause(){player.pause()}// 暂停functionseekTo(ms:number){player.seek(ms)}// 拖到指定毫秒// 监听状态与进度player.on(stateChange,(state){console.info(播放器状态state)// playing / paused / completed})player.on(timeUpdate,(cur:number,dur:number){this.progresscur/dur// 计算播放进度比例})play()/pause()最基础的播放暂停。seek(ms)跳转到指定时间做进度条拖动用。timeUpdate事件持续回调当前时间和总时长用来更新进度条。完整播放器骨架EntryComponentV2struct VideoPlayer{LocalsurfaceId:stringLocalprogress:number0Localplaying:booleanfalseprivatexcCtrl:XComponentControllernewXComponentController()privateplayer?:media.AVPlayerbuild(){Column(){XComponent({id:v,type:XComponentType.SURFACE,controller:this.xcCtrl}).onLoad(async(id){this.surfaceIdidthis.playerawaitmedia.createAVPlayer()this.player.urlfile:///data/storage/el2/base/haps/entry/files/demo.mp4this.player.surfaceIdidthis.player.on(timeUpdate,(c,d){this.progressd?c/d:0})}).width(100%).height(240)Row(){Button(this.playing?暂停:播放).onClick((){if(this.playing){this.player?.pause();this.playingfalse}else{this.player?.play();this.playingtrue}})Slider({value:this.progress*100,min:0,max:100}).onChange((v){this.player?.seek(v/100*1000)})}}.padding(12)}}这是一个能播、能暂停、能拖进度的播放器雏形。常见误区小白必踩误区说明surfaceId没拿到就初始化播放器必须先等XComponent.onLoad拿到表面 id再创建 AVPlayer 绑定。不监听timeUpdate进度条要的当前/总时长都从这里来不监听就做不了进度条。音频也套 XComponent纯音频不需要画面载体直接createAVPlayer设 url 播放即可。下面这段代码可以直接复制到 DevEco Studio 里运行。建议你边读边敲改一改文末「动手改一改」里的参数亲眼看看效果。完整可运行示例AVPlayer 播音频用AVPlayer播放一段网络音频带播放/暂停控制。代码解析// AVPlayer 播放网络音频import{media}fromkit.MediaKitEntryComponentstruct AudioPlayer{privateavp?:media.AVPlayerStateplaying:booleanfalseaboutToAppear(){media.createAVPlayer().then((p){this.avpp p.urlhttps://example.com/song.mp3// 设置数据源p.on(stateChange,(s){if(splaying){this.playingtrue}if(spaused){this.playingfalse}})})}build(){Column({space:16}){Text(this.playing?播放中:已暂停).fontSize(20)Button(this.playing?暂停:播放).onClick((){if(this.playing){this.avp?.pause()}else{this.avp?.play()}})}.padding(20)}}你会看到什么进入页面后点「播放」文字变「播放中」并听到声音点「暂停」停止。状态由stateChange事件驱动 UI。动手改一改把url换成你自己的音频地址验证。监听timeUpdate事件做一个进度条。在aboutToDisappear里this.avp?.release()避免资源泄漏。写在最后AVPlayer 的套路建播放器 → 绑 surfaceId → 设 url → 监听进度 → 控制播放。画面靠XComponent出控制靠play/pause/seek。音频播放更简单——不需要XComponent直接createAVPlayer设 url 播放即可。做音乐 app 的话把视频那套 surface 部分去掉就行。

HarmonyOS7 音视频播放：AVPlayer 实战

相关推荐

静态路由与DHCP中继对比：2种方案实现跨VLAN三层互通与地址分配

终极音频质量提升指南：如何通过MPC-HC的zita-resampler实现无损音频重采样优化

HarmonyOS7 权限申请全流程：从声明到动态授权

更多资讯

电工证电压测试多少钱？良心建议帮你避开报名坑

考电工证在哪查成绩保姆级教程：外省证能转过来吗

沧州想考电工证在哪里上岗必备怎么快速拿到证

河北哪里可以考电工证怎么考 2026河南最新政策怎么应对

农民电工证怎么办？上岗必备证件怎么考？全攻略来了

温县电工证报名常识：实操考试心里没底怕挂科？全国通用证书怎么拿？

今日更新

电工证考试及格线你知道多少？值不值得考

南通电工证发证单位考前押题怎么搞？工地太忙根本没时间复习考试

黄陵县高低压电工证怎么考？上岗必备全流程避坑指南

本周精选

安监局电工证分数查询怎么查才能知道含金量高不高

新疆电工作业干活累吗良心建议助你避开考不过的坑

中牟县电工证怎么报名外省证能转吗

本月热门

面向复杂光照与角度的宠物面部识别鲁棒性增强策略

基于DRV8818与STM32的双极步进电机驱动方案实战解析

DRV8818PWPR+PIC18F45K80双极步进电机控制方案实战

读完文章，想聊聊您的网站？