建行门户网站,cpanel wordpress,访问最多技术网站排名,seo在网站制作音乐播放微信小程序 1.项目描述2. 绪论3.项目功能4.界面展示5.源码获取 1.项目描述
随着科技的发展#xff0c;手机在我们生活中起到了重要的作用。软件作为手机重要的一部分#xff0c;用户体验显得尤为重要。微信小程序一起操作便捷、用户基数大、分享便利、既用即走等特点… 音乐播放微信小程序 1.项目描述2. 绪论3.项目功能4.界面展示5.源码获取 1.项目描述
随着科技的发展手机在我们生活中起到了重要的作用。软件作为手机重要的一部分用户体验显得尤为重要。微信小程序一起操作便捷、用户基数大、分享便利、既用即走等特点。根据微信小程序的特点设计开发了基于微信小程序的音乐播放器。目的是将传统的音乐播放方式彻底的解脱出来提高效率减轻工作人员以往繁忙的工作减少出错的概率。 根据需求确定系统采用JSP技术JAVA作为编程语言MySQL作为数据库。整个系统要操作方便、易于维护、灵活实用。 关键词微信小程序 音乐播放器 JSP MYSQL
Research on music player based on Wechat applet Abstract With the development of technology, mobile phones have played an important role in our lives. As software is an important part of mobile phones, user experience is particularly important. WeChat applets are easy to operate together, have a large user base, convenient sharing, and ready-to-use features. According to the characteristics of the WeChat applet, a music player based on the WeChat applet was designed and developed. The purpose is to completely get rid of the traditional way of playing music, improve efficiency, reduce the busy work of staff in the past, and reduce the probability of errors. According to the requirements, determine that the system uses JSP technology, JAVA as the programming language, and MySQL as the database. The entire system should be easy to operate, easy to maintain, flexible and practical. Keywords: WeChat Mini Program; music player; JSP; MYSQL
2. 绪论
引言 近年来微信发展规模越来越大越来越多的人开始使用微信目前智能手机系统的普及人们手机上基本都有了微信根据去年公布的一组数据中可知微信去年最高用户量达到10亿多而建立在微信平台基础上的小程序凭着它不用安装、不占内存、使用便捷、用完即走等众多优点小程序借着微信平台快速成长也为各行业的发展带来了极大的便利这使得基于微信小程序的系统应运而生。基于以上微信的发展开发了本基于微信小程序的音乐播放器为用户提供一个便利的平台。
** 系统开发意义** 随着互联网的发展传统生活变得更加方便快捷许多事物都可以跟互联网相连接日常生活离不开计算机更离不开互联网例如生活中最平常的衣食住行都有其相关的智能产品所以科技改变生活传统的生活方式面对互联网的新浪潮的冲击已经渐渐退出了历史舞台相信未来的某一时刻传统的生活方式将进入全智能化的阶段。本次开发的基于微信小程序的音乐播放器相对于传统的APP脱离了平台的限制所以基于微信小程序的音乐播放器也是信息时代发展的必然趋势。
3.项目功能
本系统实现一个基于微信小程序的音乐播放器。具体功能描述如下 1.音乐馆实现歌曲榜歌手的列表显示可以按歌曲、歌单、专辑进行搜索可以按分类浏览歌曲可以查看歌曲信息歌手信息可以播放或暂停歌曲。 2.私人FM实现电台的列表显示可以调频可以播放或暂停歌曲。 3.我的实现播放列表的显示可以播放音乐。
4.界面展示
音乐馆实现 此页面实现歌曲榜歌手的列表显示可以按歌曲、歌单、专辑进行搜索。界面如下图
图5.1音乐馆页面
getResult:function(res){console.log(url,url)var selfthis;wx.request({url: urlIndex/getResult,success:function(res){console.log(取得首页内容,res);if(res.data.code0){app.globalData.bannerres.data.banner,app.globalData.newSongres.data.newSongself.setData({newSong: res.data.newSong,banner: res.data.banner,list: res.data.list,show:true,class:res.data.class});}else{wx.showModal({title: 警告,content: 服务器返回数据错误,})}}});
},4.2 音乐播放页面 此页面实现用户可以播放或暂停音乐。界面如下图
图5.2音乐播放页面
playmusic: function (id) {var self this;wx.request({url: url song?id id,success: function (res) {app.globalData.curplay res.data.songs[0];if (!res.data.songs[0].mp3Url) {console.log(歌曲链接不存在歌曲下架了);self.setData({disable: true})} else {wx.playBackgroundAudio({dataUrl: res.data.songs[0].mp3Url,title: res.data.songs[0].name,success: function (res) {app.globalData.globalStop false;app.globalData.playtype 1}});wx.setNavigationBarTitle({ title: app.globalData.curplay.name - app.globalData.curplay.artists[0].name });}}});
}4.3 歌曲列表页面 此页面实现歌曲的列表显示可以播放歌曲。界面如下图
图5.3歌曲列表页面
wx.request({url: urlIndex/songList,data:{id:e.id,},success:function(res){self.setData({song: res.data.song,banner: res.data.banner,show: true, });}
})4.4 播放列表页面 此页面实现播放的列表显示可以播放歌曲。界面如下图
图5.4播放列表页面
onLoad: function (options) {var selfthis;self.setData({userInfo: app.globalData.userInfo,hasLogin:app.globalData.hasLogin,newSong: app.globalData.newSong,curplay: app.globalData.curplay,});
},4.5 歌手详情页面 此页面实现歌手详情的显示可以查看歌曲信息歌手信息。界面如下图
图5.5歌手详情页面
onLoad: function (e) {console.log(e)var selfthis;wx.setNavigationBarTitle({title:e.name});wx.request({url: url Index/getSingerInfo?id e.id,success: function (res) {console.log(singerInfo List:, res);self.setData({info: res.data.info,loading: true,songs:res.data.songs});}})console.log(this.data)
},4.6 私人Fm页面 此页面实现电台的列表显示可以调频可以播放或暂停歌曲。界面如下图
图5.6私人Fm页面
onLoad: function (options) {var selfthis;wx.request({url: urlIndex/radioList,success:function(res){console.log(radioList:,res);self.setData({banner: app.globalData.banner,radioList: res.data,show: true});}})console.log(this.data)
},5.源码获取
欢迎大家点赞、收藏、关注、评论、批评啦 、查看获取联系方式
