vue仿酷狗音乐播放器的设计与实现

2024-11-01

用vuejs写了一个酷狗的webApp

这几天在学习vueJS,学了半个月,觉得是不是该写点什么呢?于是 .脑子一抽,仿了一个酷狗的webapp. 项目截图: 由于是单页应用,切换路由时音乐不会停止,算是一个小亮点吧. 技术栈: vuejs2.0 vue-router vuex vue-router mint-ui 演示地址和项目地址 github.com/lavyun/vue-kugouMusic 如果有刚刚开始学习vuejs的同学可以把项目clone下来可以看看vue单页应用的构建方式,或者怎么写路由...这个项目根据本人深入程

仿酷狗音乐播放器开发日志十九——CTreeNodeUI的bug修复二（附源码）

转载请说明原出处,谢谢今天本来打算把仿酷狗播放列表的子控件拖动插入功能做一下,但是仔细使用播放列表控件时发现了几个逻辑错误,由于我的播放列表控件是基于CTreeViewUI和CTreeNodeUI做得,所以产生这几个bug的原因还在于他们两个,在<仿酷狗音乐播放器开发日志十一 ——CTreeNodeUI的bug修复>中已经修复过一个动态添加控件的相关bug,这属于第二次修复了.关于第一次bug的修复,后来 Duilib扩展群的 joe 又进行过比我更全面的修复,我现在使用的CTreeVie

Redrain仿酷狗音乐播放器开发完毕，发布测试程序

转载请说明原出处,谢谢~~ 从暑假到现在中秋刚过,我用duilib开发仿酷狗播放器大概经历了50天.做仿酷狗的意图只是看原酷狗的界面比较漂亮,想做个完整一些的工程来练习一下duilib.今天把写好的程序代码综合一下,发布测试版,现在一共写了10355行c++代码和大约2000行xml代码.测试版的程序肯定会有不少bug,而我自己也没有精心去测试程序,希望发现问题的朋友联系我一下,我去修正.程序在win8下运行会有问题,请在兼容性里调整一下!整个软件的开发过程可以看前面发布的博客! 软件界面上绝大

仿酷狗音乐播放器开发日志二十七用ole为窗体增加文件拖动功能（附源码）

转载请说明原出处,谢谢~~ 中秋到了,出去玩了几天.今天把仿酷狗程序做了收尾,已经开发完成了,下一篇博客把完结的情况说一下.在这篇博客里说一下使用OLE为窗体增加文件拖拽的功能.使用播放器,我更喜欢直接拖动音乐文件添加到软件里,所以做这个功能很重要.做OLE拖拽之前学习了两篇文章: http://www.codeproject.com/Articles/840/How-to-Implement-Drag-and-Drop-Between-Your-Progra%E3%80%91 http://b

仿酷狗音乐播放器开发日志二十四选项设置窗体的实现（附328行xml布局源码）

转载请说明原出处,谢谢~~ 花了两天时间把仿酷狗的选项设置窗体做出来了,当然了只是做了外观.现在开学了,写代码的时间减少,所以整个仿酷狗的工程开发速度减慢了.今天把仿酷狗的选项设置窗体的布局代码分享出来,给学习duilib布局的朋友做个demo.现在编写的仿酷狗选项设置窗体和原酷狗的窗体不细看几乎看不出差别,控件的布局位置和原酷狗最多只有几个像素的位置差别. 先来看一下原酷狗的选项设置窗体的其中一个页面: 如果还不太会布局的朋友可以先看我前些日子写的关于duilib布局的博客<duilib各种布

仿酷狗音乐播放器开发日志二十五 duilib右键事件的不足的bug修复

转载请说明原出处,谢谢~~ 虽然仿酷狗的各个菜单早就写好了,但是一直没有附加到程序里.今天把菜单和播放列表控件关联时发现了问题. 和播放列表相关的菜单有三个,分别是每个音乐项目控件相关的菜单.分组的菜单.音乐电台的菜单.应该的效果如下: 原本我想着只要给对应的控件设置menu属性,然后在代码里响应消息弹出菜单就可以了.但是实际测试发现,控件根本无法响应到menu消息,原因在于:音乐项目.电台项目这些控件都是靠许多子控件组合而成的,换句话就是他们上面覆盖了很多其他子控件,子控件挡住了音乐项目和电台

仿酷狗音乐播放器开发日志二十六 duilib在标题栏弹出菜单的方法

转载请说明原出处,谢谢~~ 上篇日志说明了怎么让自定义控件响应右键消息.之后我给主窗体的标题栏增加右键响应,观察原酷狗后可以发现,在整个标题栏都是可以响应右键并弹出菜单的.应该的效果如下: 本以为像上一片博客那样,处理标题栏的布局的右键消息就可以了.后来发现在duilib的标题栏中无法像在客户区那样自如响应UIEVENT_CONTEXTMENU消息的.所以还得用另外的方法. 在非客户区处理右击消息对应的是WM_NCRBUTTONUP,WM_NCRBUTTONUP是和WM_NCHITTEST相辅相

仿酷狗音乐播放器开发日志二十三修复Option控件显示状态不全的bug（附源码）

转载请说明原出处,谢谢~~ 整个仿酷狗工程的开发将近尾声,现在还差选项设置窗体的部分,显然在设置窗体里用的最多的就是OptionUI控件,我在写好大致的布局后去测试效果,发现Option控件的显示效果很不理想.在源码中可以知道(属性列表中列的不全面)Option提供了8种显示状态,分别为 <Attribute name="normalimage" default="" type="STRING" comment="普通状态图片&q

仿酷狗音乐播放器开发日志十一——CTreeNodeUI的bug修复

由于做播放列表控件,我的CMusicLength控件继承了CTreeVieWUI控件,在向分组控件中添加播放项目时,发现代码无法正常工作,调用CTreeNodeUI控件的Add方法后无反应,导致我的播放器无法动态增加项目. 在对duilib源码调试后发现,CTreeNodeUI类的AddAt方法存在bug,AddAt的原型为 long CTreeViewUI::AddAt( CTreeNodeUI* pControl, int iIndex ): 其中的iIndex参数代

仿酷狗音乐播放器开发日志三——修复CEditUI的bug2

无意中发现了CEditUI控件的另一个bug,当我给播放器的搜索栏获取焦点时,这时再改变窗体大小,原本搜索栏应该对应着也改变大小,却发现CEditUI内嵌的edit控件没有跟着改变(如下图),跟着调试了一段时间,发现是CEditUI类中的CEditWnd类的OnKillFocus函数中提前把m_pWindow指针赋值为NULL,导致CEditUI在调整控件位置时误以为edit控件还没创建,解决办法是注释掉OnKillFocus函数中把m_pWindow指针赋值为NULL的代码. bug修

项目源码--Android类似酷狗音乐播放器

下载源码知识技能概要: 1.音乐文件的扫描与管理 2.音频流的解码 3. UI控件的综合使用 4.播放列表方式管理 5.随机播放方式 6.源码带详细的中文注释 ...... 详细介绍 1. 音乐文件的扫描与管理播放器具有扫描本地文件功能,将音乐文件加入支持播放的列表中 2. 音频流的解码采用系统自带解码的方式,对音乐文件数据流进行解码播放 3.UI控件的综合使用本套音乐播放器采用的底部功能区域TAB方式,提供能曲库,随便听听,搜歌,功能菜单等四个主要模块 4.播放列表方式管理提供了播放

vue——一个页面实现音乐播放器

请忽略下面这段文字年关将至,时间好歹又多出了些许.却不敢过度消遣.岁月未曾饶过我,我亦不想饶过岁月.且将它塞得膨胀,让这一年看似加更充实.不曾料想我一个爱些风花雪月.研墨行歌之人,却做起了碼农这一行当.虽做了碼农,却断不了嗜好,日日必听歌.奈何近日,公司限制高流量网络访问.虾米.网易云.QQ甚至酷狗,无一幸免.没有了歌,变得像挨了锤的牛一样,疲软成一滩烂泥.所幸还能用用listen 1,可这listen 1却让人味同嚼蜡.歌且无过,想是这界面不合胃口.做一名前端,也沾了对外观挑三检四的毛病.于是

【大结局】《从案例中学习JavaScript》之酷炫音乐播放器（四）

这是之前写的用H5制作的音乐播放器,前三节其实已经做得差不多了,音轨的制作原理已经在上一节说明,不过一直还没有和音乐对接. 本章作为该系列的一个完结篇,我会专门把动态音轨的实现代码贴出来,demo地址会在文章最后给出. 为了尽可能保持条理清晰,我就重新开一个页面来说明吧.你把本文的代码拷过去,应该是可以直接运行的.(当然,音乐文件需要换成你本地的) 1. 画一个demo页 <!DOCTYPE html> <html> <head> <meta charset=&q

Android 仿百度网页音乐播放器圆形图片转圈播放效果

百度网页音乐播放器的效果如下 : http://www.baidu.com/baidu?word=%E4%B8%80%E7%9B%B4%E5%BE%88%E5%AE%89%E9%9D%99&tn=98012088_3_dg&ch=2&ie=utf-8 手机上的效果如下 : 完整项目下载地址 :http://download.csdn.net/detail/abc13939746593/7380519

Android音乐播放器的设计与实现

目录应用开发技术及开发平台介绍应用需求分析应用功能设计及其描述应用UI展示一.应用开发技术及平台介绍 ①开发技术: 本系统是采用面向对象的软件开发方法,基于Android studio开发平台,以Android作为本系统的开发语言实现音乐播放器预定的需求功能. ②平台介绍硬件平台 CPU奔腾双核 (主频2.0GHz) 内存1G以上 64或32位PC机 500G硬盘软件平台操作系统:Windows XP \ Win7\Win8\win10 开发工具:Android Studio 本

ios开发：一个音乐播放器的设计与实现

github地址:https://github.com/wzpziyi1/MusicPlauer 这个Demo,关于歌曲播放的主要功能都实现了的.下一曲.上一曲,暂停,根据歌曲的播放进度动态滚动歌词,将当前正在播放的歌词放大显示,拖动进度条,歌曲跟着变化,并且使用Time Profiler进行了优化,还使用XCTest对几个主要的类进行了单元测试. 已经经过真机调试,在真机上可以后台播放音乐,并且锁屏时,显示一些主要的歌曲信息. 首页: 歌曲内部播放: 当拖动小的进度条的时候,歌曲也会随之变化.

痞子衡嵌入式：基于恩智浦i.MXRT1010的MP3音乐播放器(RT-Mp3Player)设计

大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是基于i.MXRT1011的MP3播放器参考设计. i.MXRT1011是恩智浦i.MXRT四位数系列的入门型号,虽然是入门级,可也是500MHz主频的大杀器. 为了让大家见识到i.MXRT1011的能量,特给大家分享一个基于i.MXRT1011-EVK开发板的MP3播放器设计,mp3源文件从U盘获取,使用Helix MP3库进行软解码,最后将解码出的pcm数据通过板载Codec(WM8960)连耳机进行播放. 功能模块简图: 这个设

HTML5打造的炫酷本地音乐播放器-喵喵Player

将之前捣腾的音乐频谱效果加上一个播放列表就成了现在的喵喵播放器(Meow meow Player,额知道这名字很二很装萌~),全HTML5打造的网页程序,可本地运行也可以挂服务器上用. 在线Demo及源码你可以访问下面的地址打开在线demo: http://wayou.github.io/MeowmeowPlayer/ 项目github地址: https://github.com/Wayou/MeowmeowPlayer/ 示例音乐下载,提供给硬盘里没有Music的同学:http://pan.

团队项目 NABCD分析java音乐播放器

NABCD分析java音乐播放器程设计题目:java音乐播放器一.课程设计目的 1.编程设计音乐播放软件,使之实现音乐播放的功能. 2.培养学生用程序解决实际问题的能力和兴趣. 3.加深java中对多媒体编程的应用. 二.课程设计的要求利用学到的编程知识和编程技巧,要求学生: 1.系统设计要能完成题目所要求的功能,设计的软件可以进行简单的播放及其他基本功能. 2.编程简练,可用,尽可能的使系统的功能更加完善和全面 3.说明书.流程图要清楚. 三.课程设计内容 1.课程设计的题目及简介音乐

SE Springer小组之《Spring音乐播放器》需求分析说明书一

软件需求说明书软件需求说明书的编制是为了使用户和软件开发者双方对该软件的初始规定有一个共同的理解, 使之成为整个开发工作的基础. 1 引言 1．1编写目的使用户对该软件的初始规定有一个理解,也使软件开发者对该软件开发的目的.任务.需求及运行环境有一定的了解,为整个开发工作做好准备. 1．2背景 a．待开发的软件系统的名称:spring音乐播放器: b．本项目的任务提出者.开发者为宁牟明.曹乐平.莫雪萍.杨子鲲: 用户暂定为开发者自己或周围同学: C．spring音乐播放器软件系统要与本地的检

基于JavaFX实现的音乐播放器

前言这个是本科四年的毕业设计,我个人自命题的一个音乐播放器的设计与实现,其实也存在一些功能还没完全开发完成,但粗略的答辩也就过去了,还让我拿了个优秀,好开心.界面UI是参考网易云UWP版本的,即使这样,实现还是要花费很多心思去实现的.我建议在Linux或者MacOS平台下运行(比较好看),Windows平台的界面我当时模仿UWP版本的窗口风格弄得不是很好,有一些问题.分享出来,希望对JavaFX感兴趣的同学可以作为参考,也可以私聊我讨论. 测试运行环境配置项客户端1配置客户端2配置客户

vue仿酷狗音乐播放器的设计与实现

热门专题