SmartisanMusicPlayer仿写的一个锤子音乐播放器

最新推荐文章于 2019-05-13 20:53:06 发布
原创 最新推荐文章于 2019-05-13 20:53:06 发布 · 1.1k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#Rxjava  #GreenDao #MusicPlayer #Smartisan

本项目SmartisanMusic为一款本地音乐播放器，灵感来源于锤子音乐播放器，支持基本播放功能，并具备按歌手和专辑分类的播放列表、收藏、歌词显示等功能。采用RxJava、Glide和GreenDao等技术实现。

a.jpg

b.jpg

artisanMusic.gif

ArtisanMusic

#项目介绍：

SmartisanMusic 仿照锤子音乐播放器写的一个本地音乐播放器，会尽可能的实现锤子音乐播放器已有的功能。
也会去除一些功能，比如去除:云音乐，联网搜索，因为主要还是播放本地音乐为主。
同时也会增加一些个人觉得有趣的交互，比如增加了类似QQ音乐的左右滑动切换上/下一曲的交互。用GreenDao实现了收藏功能，也使用了Rxjava的一些
操作符：timer、interval、map等，还有Rxbus作为EventBus的替代者，在本项目开发中使用频繁，如多页面的UI更新，数据的传送。目前实现的功能：播放功能、播放列表的分类（按歌手和专辑）、侧边导航栏、收藏、通知栏、歌词滚动、屏幕常亮。

第三方库

https://github.com/1900Star/SmartisanMusicPlayer
仿酷狗音乐播放器
牟尼的专栏
11-08 4338
之前做过简单的音乐播放器，是用VC写的。但界面过于简单，看着很不美观，所以就想做一个像酷狗这样的播放器。今年三月份多完成了它，终于能有那么点意思了，至少界面有了几分相似了。但实际内部的设计和架构并不合理，所有的东西都很乱，现在我将其重新架构了一下，但界面没有改变！ 下面是界面截图： 本程序运行环境VC6.0，使用MFC的对话框框架，VC实现。 一、整体设计  1.采用MVC的三层架
用c#制作简易的音乐播放器
2303_76991884的博客
05-10 1210
代码使用了.NET框架中的Windows media player控件来处理音频文件的播放和控制。这段代码创建了一个简单音乐播放器界面，包括的功能有：播放ogg文件、播放、暂停、音量调节。用户可以通过相应的按钮控制音乐的播放状态。
锤子rom音乐播放器
06-17
从锤子rom中提取出来的。锤子系统的音乐播放器，不会替换系统自带的，有3D音效。好用。
锤子音乐
01-30
锤子音乐 完全可以使用4 0以上
模仿音乐播放器项目
caozuiba
02-11 211
这个项目是过年回家做的，虽然还不够完善，但是实现了主要的功能，另外还增加了甩歌功能。本来想增加滑动图片切歌这个功能呢，但是还不知道怎么获取音乐资源的相关图片，如果有会的希望指正。 下面是项目截图： 点击某一首进入播放界面： 可以点击左上角单曲循环和循环播放，上面的进度条是可以控制音量大小的，下面进度条可以拖动播歌，最下边的按钮可以切换上一首下一首和第一首最后一首。最...
精选资源
微信小程序源代码-仿写AppleMusic的音乐播放器程序.rar
04-15
本项目为一款基于微信小程序的仿写Apple Music音乐播放器程序，旨在为用户提供一个高品质、易用的音乐播放体验，同时满足音乐爱好者对个性化推荐和社交分享的需求。 项目功能介绍： 1. 音乐库：程序提供丰富的音乐...
一个仿写的视频音量调控的小控件供自己学习加深印象使用.rar
07-30
这个压缩包文件“一个仿写的视频音量调控的小控件供自己学习加深印象使用.rar”包含了一个用于视频音量控制的模拟实现，主要是为了提供学习和理解的目的。在这个项目中，开发者可能通过创建一个自定义的UI小部件...
一年级语文下仿写句子汇总.docx
03-26
一年级语文下仿写句子汇总
使用易语言仿写一个简单版本的LookHandles.zip
11-28
在这个项目“使用易语言仿写一个简单版本的LookHandles.zip”中，开发者旨在使用易语言模仿并重现出一个简化版的LookHandles工具。LookHandles是一款可以查看系统进程信息、模块信息以及窗口信息的工具，它可以帮助...
锤子分贝
02-10
锤子分贝
Android做的一个音乐播放器
03-12
Android写的一个播放器例子、有需要的朋友可以下载来看看
Android-MusicWind基于Kotlin一个简单音乐播放器使用retrofit2RX1OKHttp框架
08-12
基于Kotlin 一个简单音乐播放器，使用retrofit2 RX_1 OKHttp 框架使用google Architecture Components 作为项目的架构，包含 Lifecycle ，LiveData ， ViewModel
Android 聚合音乐播放器
u014296677的专栏
07-29 2415
MusicLake Android 音乐播放器 除了本地音乐，还包括百度音乐，QQ音乐、虾米音乐、网易云音乐等网络音乐播放 支持在线歌曲下载 歌词播放、桌面歌词、桌面小控件 通知栏控制、线控播放、音频焦点控制 QQ登录、在线歌单同步 百度电台列表，网易云mv排行榜，mv播放评论 酷狗歌词搜索、修改歌词样式 更多体验请下载apk，欢迎star，尽情提#issues 下载 点这下载 软...
ios音乐播放器-仿QQ音乐
xiaozhaoqiang的博客
12-11 3169
这篇文章主要写一个iOS系统下的音乐播放器 , 包括简单的仿QQ音乐播放器界面、音乐播放、歌词解析、后台控制等  ，如果你正好需要 , 希望你看完后能够对你的提升有所帮助 , 当然，阅读中如果发现什么错误和可优化的地方 , 希望可以得到你的指点 , 有任何不妥的地方 欢迎指正 先上截图和demo 下面说一下实现步骤吧 一、界面搭建
仿照网易云界面做的Flask网页音乐播放器（豪华版）
AA_LiuIsMe_AA的博客
05-13 2849
一个基于Flask的网页音乐播放器，前端用了h5，css，jq，ajax，hash，数据库是mysql。有管理员上传音乐的功能，注册一个账户名为Admin的账户就可以了。 主要功能：歌单收藏夹（我的音乐），排行榜，首页推荐，音乐搜索，播放列表，播放模式（播放列表旁边的小三角）等等等等。。。。。作者太懒，功能太多已经懒得多说，连图都懒的多截，界面大部分是仿照网易云制作的。 另外一提，作者的h5...
实现一个简单音乐播放器
weixin_34352005的博客
12-09 844
做的一个简单的半成品播放器 一、需求分析 1、写静态页面2、通过getMusicList函数用Ajax获取歌曲数据列表musiclist3、通过loadMusic函数实现歌曲的播放功能4、根据获取的歌曲数据来设置歌名、作者和背景图片5、设置进度条随歌曲进度而实时变更，通过给audio对象绑定ontimeupdate事件来实现6、设置歌曲时...
学递来啦高校快递末端物流配送需求对接众包服务平台项目_高校学生快递代取互助资源共享社区生态体系_面向当代大学生解决校园内快递包裹最后一公里配送难题通过众包模式实现需求发布与接单构建.zip
最新发布
12-04
学递来啦高校快递末端物流配送需求对接众包服务平台项目_高校学生快递代取互助资源共享社区生态体系_面向当代大学生解决校园内快递包裹最后一公里配送难题通过众包模式实现需求发布与接单构建.zip
vue js来仿写一个QQ音乐界面
06-10
### 用 Vue.js 实现 QQ 音乐界面的设计与实现 在使用 Vue.js 仿制 QQ 音乐界面时，可以参考现有的项目结构和技术栈。以下是一个完整的解决方案，包括技术选型、项目结构设计和关键功能实现。 #### 技术选型 为了实现一个功能完善的移动端 QQ 音乐界面，可以选择以下技术栈： - **Vue.js**：作为核心框架，用于构建用户界面。 - **Vue Router**：实现页面路由管理。 - **Vuex**：用于状态管理，确保数据在不同组件间同步[^2]。 - **Axios**：处理 HTTP 请求，获取接口数据。 - **SASS/LESS**：用于样式管理，提升代码可维护性。 #### 项目结构设计 一个典型的 Vue.js 项目结构如下： ```plaintext src/ ├── assets/ # 存放静态资源（图片、字体等） ├── components/ # 可复用的组件 │ ├── Player.vue # 播放器组件 │ ├── SongList.vue # 歌单列表组件 │ └── SearchBar.vue # 搜索栏组件 ├── views/ # 页面级别的组件 │ ├── Home.vue # 首页 │ ├── Singer.vue # 歌手详情页 │ └── Playlist.vue # 歌单页 ├── store/ # Vuex 状态管理 │ ├── index.js # Vuex 入口文件 │ ├── state.js # 状态管理 │ ├── mutations.js # 修改状态的方法 │ ├── actions.js # 异步操作 │ └── getters.js # 映射数据 ├── router/ # 路由配置 │ └── index.js ├── services/ # 封装 API 请求 │ └── api.js └── App.vue # 根组件 ``` #### 关键功能实现 1. **播放器功能** - 使用 `HTML5` 的 `<audio>` 标签实现音乐播放。 - 提供播放、暂停、进度条等功能。 ```vue <template> <div class="player"> <audio :src="currentSongUrl" controls ref="audioPlayer"></audio> <button @click="togglePlay">播放/暂停</button> </div> </template> <script> export default { data() { return { currentSongUrl: 'https://example.com/song.mp3' }; }, methods: { togglePlay() { const audio = this.$refs.audioPlayer; if (audio.paused) { audio.play(); } else { audio.pause(); } } } }; </script> ``` 2. **歌单列表展示** - 利用 `v-for` 指令渲染歌曲列表。 - 每个列表项绑定点击事件，切换当前播放歌曲。 ```vue <template> <ul> <li v-for="(song, index) in songList" :key="index" @click="playSong(song)"> {{ song.name }} - {{ song.artist }} </li> </ul> </template> <script> export default { data() { return { songList: [ { name: '歌曲1', artist: '歌手1', url: 'url1' }, { name: '歌曲2', artist: '歌手2', url: 'url2' } ] }; }, methods: { playSong(song) { this.currentSongUrl = song.url; } } }; </script> ``` 3. **歌手详情页** - 使用 `Vuex` 管理歌手数据，确保跨组件共享。 - 在 `actions.js` 中封装异步请求逻辑。 ```javascript // store/actions.js import axios from 'axios'; export const fetchSingerDetail = ({ commit }, singerId) => { return axios.get(`/api/singers/${singerId}`) .then(response => { commit('SET_SINGER_DETAIL', response.data); }); }; ``` 4. **路由配置** - 使用 Vue Router 定义页面跳转逻辑。 ```javascript // router/index.js import Vue from 'vue'; import Router from 'vue-router'; import Home from '@/views/Home.vue'; import Singer from '@/views/Singer.vue'; Vue.use(Router); export default new Router({ routes: [ { path: '/', component: Home }, { path: '/singer/:id', component: Singer } ] }); ``` #### 数据抓取与接口调用 在实际开发中，需要从 QQ 音乐或其他音乐平台获取歌曲数据。由于接口可能发生变化，建议定期检查并更新请求逻辑[^4]。 ```javascript // services/api.js import axios from 'axios'; export const getSongs = () => { return axios.get('https://api.example.com/songs'); }; export const getSingerDetail = (singerId) => { return axios.get(`https://api.example.com/singers/${singerId}`); }; ``` ---
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值