Flutter——仿网易云音乐App(基础版)

首页

歌曲播放和卡片切换

如正版同样,歌曲播放进度在播放/暂停 按钮的边框显示(页面下方,由黑变红)git

没登陆的话,通常只能听12秒
目前只作了 模块(‘超带感的说唱精选’)的点播功能,
其余地方能够直接套用(一、2行代码便可),控制台已经写好
复制代码

卡片(音乐日历)切换动画也是仿照正版来github

我的中心和抽屉(未登陆)

云村

视频(未登陆)

视频模块须要登陆才能看到设计模式

波纹动画依然是仿照正版的
复制代码

登陆

视频(已登陆)

登陆先后页面变化

咱们看一下,个人、抽屉页面的先后差别api

再退出一下

‘切换帐号’有退出的功能
复制代码

搜索页面

所用接口

接口为大佬们开源的网易云API,在此感谢缓存

开源网易云api服务器

我花了90多买了个云服务把接口clone下来后,开发使用。markdown

各位clone我项目时,能够用个人接口也能够本身搭一个
一年90多的云服务器,大家用时轻点儿...
复制代码

Tip: 接口返回的数据不太稳定,有的时候还会变形,对于移动端开发来讲,形成了一些麻烦,各位开发时要注意。架构

另外,若是你运行这个demo发现出错了,那大几率时接口废了或者数据变形了,看日志吧
复制代码

开发框架 Bedrock

此项目基于Bedrock 快速开发框架开发框架

MVVM + Provider 设计模式
复制代码

Bedrock 快速开发框架ide

初衷

开发这个demo并非为了对flutter进行练习,而是由于前些日子对flutter路由模块的封装,并应用于Bedrock框架。

在重构了原项目的demo以及添加了针对性演示demo后,以为有必要再在一个复杂一些的项目里测试一下,所以便有了这个:

仿网易云音乐(基础版)
复制代码

也算是给个人框架增长了一个绘声绘色的大Demo吧 :)。

与此同时,既然是Demo,在项目开发时尽可能作到点到为止,避免开发者阅读过多的冗余的页面代码,而没法了解框架的工做原理。

因为没有设计图,页面全凭感受来,加之接口的不稳定(类型/结果),开发起来确实费劲...
因此叫基础版
复制代码

路由封装的简介

这次路由封装,不但减小了开发时的代码书写,而且对外暴露出state,能够作到任何粒度的刷新。

但这并不意味着能够抛弃provider
复制代码

在兼容静态路由的优点同时,对于静态路由的 map 传值,取而代之的是构造函数传值,这样避免了key的输错。

更多介绍能够看下面的文章:

关于此次flutter路由封装的架构介绍

Demo功能概览

你们能够clone下项目后,挑拣未实现的功能来实现以熟悉框架
复制代码

登陆(注册未实现,没有空号了)

个人页面:登陆/非登陆状态(不含子级页面)

发现页面: 点歌 (不含子级页面)

云村页面:广场&关注子页(不含其它子级页面)

视频页面:登陆/非登陆状态,各tab子页面,视频播放(不含其它子级页面)

个人抽屉:登陆/非登陆状态(不含子级页面)

搜索页面:支持搜索历史本地化、清理缓存,搜索及搜索建议,(不含搜索结果和其它子级页面)

底部音乐bar:后台音乐功能模块,支持单点播放,(未实现底部控制台点击后弹出的播放历史记录和歌单,这个可能后期要作,蛮有意思的)

项目地址

仿网易云音乐

感谢

再次感谢开源网易云音乐api的大佬们。

同时欢迎各位提issue,谢谢 :)

Demo代码可能有些随意和bug,还请见谅。
复制代码
相关文章
相关标签/搜索