1. 鸿蒙音乐播放器开发入门指南
最近在折腾鸿蒙应用开发，发现用ArkTS开发音乐播放器特别有意思。作为一个从Android转战鸿蒙的开发者，我花了三天时间完整实现了一个音乐播放器，把踩过的坑和关键实现点都记录下来，希望能帮到刚入门的朋友。
鸿蒙的音乐播放功能主要依赖@ohos.multimedia.media模块的AVPlayer，它支持本地和网络音频播放。与Android的MediaPlayer类似，但API设计更符合鸿蒙的响应式编程风格。我建议先创建一个空工程，在entry/src/main/ets/pages下新建两个页面：Index.ets（首页）和Player.ets（播放页）。
开发环境配置有个小坑要注意：必须确保SDK中安装了API9的版本，并在module.json5中声明音频权限：
"requestPermissions": [ { "name": "ohos.permission.READ_MEDIA", "reason": "$string:reason" } ]2. 音乐列表页面开发实战
首页布局我采用了经典的上下结构：顶部是播放状态展示区，底部是滚动歌单。这里分享几个实用技巧：
- 图片圆角处理：鸿蒙的
borderRadius属性可以直接设置百分比：
Image(item.pic) .width(60) .height(60) .borderRadius('50%') // 圆形效果- 文字溢出处理：歌名太长时需要显示省略号：
Text(item.name) .maxLines(1) .textOverflow({overflow:TextOverflow.Ellipsis})- 高性能列表：用
ForEach渲染列表时，一定要给每个item设置唯一标识：
ForEach(this.songList, (item:songInfo, index:number) => { // 列表项内容 }, (item:songInfo) => item.id.toString() // 关键性能优化 )我建议把歌曲数据单独放在mock/song.ts中，用类封装管理：
export class song { static songList:songInfo[] = [ new songInfo(1, $r('app.media.song1'), '起风了', '买辣椒也用券', 0, 0, 0, 'song1.mp3'), // 其他歌曲... ] }3. 播放器核心功能实现
播放页是核心难点，需要处理几个关键功能：
3.1 播放器状态管理
AVPlayer有7种状态需要监听：
avPlayer.on('stateChange', (state:string) => { switch(state) { case 'prepared': this.total = avPlayer.duration avPlayer.play() break case 'playing': this.startProgressTimer() break // 其他状态处理... } })3.2 进度条同步
环形进度条使用Progress组件实现：
Progress({ value: this.currentTime, total: this.total, type: ProgressType.Ring }) .style({ strokeWidth: 8 }) .color('#4FE3C1')定时器更新进度时需要特别注意内存泄漏：
setTimer() { this.timerId = setInterval(() => { if(this.currentTime >= this.total) { this.playNext() } else { this.currentTime += 1000 // 1秒更新一次 } }, 1000) }3.3 播放控制逻辑
切歌时要先释放资源再重新初始化：
async playNext() { await this.avPlayer.release() this.currentIndex = (this.currentIndex + 1) % this.songList.length this.resetPlayer() } async resetPlayer() { this.currentTime = 0 this.avPlayer = await this.createPlayer() this.avPlayer.play() }4. 高级功能与性能优化
基础功能完成后，可以添加这些提升体验的功能：
- 后台播放：在
module.json5中添加后台服务声明：
"abilities": [ { "backgroundModes": ["audioPlayback"] } ]- 播放缓存：使用
Preferences存储播放记录：
import preferences from '@ohos.data.preferences' async savePlayState() { const prefs = await preferences.getPreferences(this.context, 'music_prefs') await prefs.put('lastPlayIndex', this.currentIndex) await prefs.flush() }- 歌词同步：解析LRC文件后使用定时器实现：
syncLyric() { this.lyricTimer = setInterval(() => { const current = this.findLyric(this.currentTime) this.currentLyric = current?.text || '' }, 200) }- 性能优化：对于长列表，建议：
- 使用
LazyForEach替代ForEach - 图片加载添加占位图
- 复杂计算放到Worker线程
const worker = new worker.ThreadWorker('entry/ets/workers/DecodeWorker.js') worker.postMessage(audioData)
