微信小程序开发音乐案例 第1篇
1.可以将正在播放的音乐添加到最喜爱歌单
2.可以创建歌单、修改歌单、删除歌单
3.可以将搜索到的歌曲添加至用户所创歌单
1.硬件：多媒体计算机
2.软件：（1）安装xmapp软件并连接到Apache服务器；
（2）安装navicat等数据库可视化操作工具并连接至版本以上的数据库；
（3）微信小程序调试基础库版本以上，并采用云开发环境；
（4）Windows系列操作系统
CourseBigHomework - 微信开发者工具
微信小程序开发音乐案例 第2篇
将上一阶段已经设计好的基本E-R图，转换为与选用的数据库管理系统所支持的数据模型相符合的逻辑结构，即关系模型的转化。此处，根据本音乐播放系统的设置，将用户、歌曲、歌单、喜爱列表列为实体，转化为适当的关系模式，则具体属性与关系设置如下：
关系模式(关系模型)
（1）用户(用户编号，用户名，密码，性别，手机号，生日，地区，用户头像)；
（3）歌单(歌单编号，歌单名，歌单信息，歌单海报，用户编号)；
微信小程序开发音乐案例 第3篇
效果图展示如下：
2.首页设计
首页这里的设计页面顶部采用的是自定义导航栏与轮播图swiper叠用，内容部分由数据库查找歌曲按照自定义组件输出为推荐歌曲，通过request请求网yi云音乐的官方API获取热门歌单与推荐歌单的信息，再通过横向scroll-view组件进行滑动展示。部分代码展示如下：
效果图展示如下：
效果图展示如下：
最后便是暂停键的设置，audio组件有一个最大的鄙陋就是，当你通过其他方式来调用该组件进行播放时，它自己本身的暂停按钮便不会显示，因此，我们需要通过自定义一个暂停按钮来控制它进行暂停操作。具体代码展示如下：
效果图展示如下：
微信小程序开发音乐案例 第4篇
最后的设计，是喜爱歌单与我的歌单的界面设计，整体界面采用类似的展示布局，仅仅在每条数据的插入显示上有不同的效果，同时可以链接歌曲进行调用audio控件播放，依然采用了自定义组件通过json文件中usingcomponent进行引用。具体展示效果如下所示：
部分代码如下：
至此，该微信小程序设计的音乐播放器系统的基本功能与界面展示完毕。如对您有所帮助，望留下宝贵一赞！谢谢！
需源码 请私信扣扣 1092644308
微信小程序开发音乐案例 第5篇
根据UI设计界面，传入静态数据后，分析逻辑思路，进行动态插入，连入数据库。
（1）首先是登录注册的数据库设计，注册即增添用户信息，发送请求，同时检测是否有相同用户登录，而登录即对用户信息进行匹配，返回结果。如上图所示。接着根据用户登录后的信息存入全局变量globalData，从而判断某些操作是否有权可以执行。
（2）接着是首页对歌曲的搜索查找，根据所提供的信息，设置数据库语言limited来限制输出的条数。
（3）同样为搜索操作的还有自定义导航栏对歌曲信息的搜索、喜爱歌单通过用户编号对歌曲的搜索、个人界面对用户自定义歌单的搜索，以及用户歌单内歌曲信息的搜索。
（4）增添操作这里以增添歌单以及增添歌曲至歌单为例，当用户搜索出自己想要的歌曲时，可以通过加号动态添加至自己所需要添加的歌单，代码展示如下：
效果展示如下：
（5）最后是关于歌单的增删改查，用户可以在个人信息界面对所有已经存在的歌单进行查看，并可以根据按钮进行修改操作，也可以通过加号动态弹出的信息框进行增添操作，最后通过删除按钮进行删除。效果图展示如下：
微信小程序开发音乐案例 第6篇
除了头像框与用户名在用户登录后会动态修改后，这个界面的会员开通部分，也可以模拟下滑拖动效果，尽可能的实现现实中已经存在的操作方法。顶端设计皆为静态操作，即没有进行额外的页面设计，而底部的组成，则主要由最喜欢的音乐与歌单部分构建，其中歌单部分采用了swiper组件，即可以动态滑轮切换，而创建已存在的歌单，也可以通过movable-view与movable-area进行滑动删除。具体页面展示效果如下所示：
微信小程序开发音乐案例 第7篇
通过关系模型，我们能进一步确立实体间的相互关系，从而方便我们进行下一步操作，按照存储结构和存取方法我们构成了数据库物理结构，这里主要根据我们总结得出的关系模型，进行表结构的建立，做出具体表格结构示意图，由于系统结构庞大，表格体现选择以比赛项目信息表的部分典型字段为例，如下所示：
表1 最喜爱歌单信息likesonglist表
字段名
数据类型
是否允许null值
likesong_id
int
主键、唯一
喜爱歌曲编号
likesong_name
varchar
歌曲名称
likesong_author
varchar