258资源分享网

QQ音乐电台小程序的核心功能开启电台好友卡片引导页（引导用户用微信登录QQ音乐或开启冷启动）冷启动卡片详情（好友相似度，好友偏好，评论）歌曲播放页（播放暂停 ...

QQ音乐电台小程序的核心功能

开启电台

好友卡片

引导页（引导用户用微信登录QQ音乐或开启冷启动）

冷启动

卡片详情（好友相似度，好友偏好，评论）

歌曲播放页（播放暂停，歌词滚动，收藏歌曲，切换歌曲，听歌流水上报，背景魔法色，适配）

miniplayer （切换歌曲，状态同步）

涉及播放歌曲状态同步，不能使用audio组件。而音频播放API本质上是借助微信native的播放组件。

使用wx.navigateTo() 跳转到应用内的某个页面，会保留当前页面。点击左上角返回，之前页面会触发onShow监听页面显示，不会触发onLoad事件。播放页和首页miniplayer状态同步相关逻辑处理应该在onShow事件监听。

歌曲信息以及变更（包括歌曲列表，播放状态，切换音频，专辑图，歌曲名，歌手等）存储在小程序提供的storage下，方便不同页面数据同步

音频组件API目前没有提供类似audio的onTimeUpdate事件，需要开了一个定时器做歌词滚动，缺点是定时器做歌词渲染有不太精准。好消息是：微信后期会支持OnTimeUpdate事件。
歌词处理相关逻辑如下：

根据专辑图拉取对应十六进制的魔法色。有些色值较亮，有点刺眼，这里需要对色值转为HSL通过降低饱和度S和亮度L来使得背景色看着柔和。

将后台返回十六进制，转为RGB值

RGB转为HSL

降低HSL 中S饱和度，L亮度让背景色不刺眼