十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
Flutter项目可以用三种方式开发:
创新互联公司专业为企业提供德州网站建设、德州做网站、德州网站设计、德州网站制作等企业网站建设、网页设计与制作、德州企业网站模板建站服务,十年德州做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。
可以根据自己的需求选择,由于之前一直做iOS开发,也做过RN项目开发,Mac上装过Android Studio 和 其他安卓模拟器 Genymotion ,所以我选择Android Studio开发工具,之前装的版本 3.0.1 比较老了,所以进行了升级 3.4 。
体验Flutter
PS:第一次创建项目可以成功,之后再执行这一步操作创建新的Flutter项目时,一直卡住,重启过很多次Android Studio一直都是这样,后面查询资料,发现自己没有同意使用 android-licenses ,可以通过下列命令验证,第一步,先验证:
第一步检测结果,发现是需要同意 android-licenses :
第二步执行同意命令,操作时会有很多个 android-licenses 需要同意:
第二步检测结果:
第三步再次验证,当得到以下截图中结果时,代表所有环境配置已经完成:
上述命令创建一个Flutter项目,项目名为 myapp ,在项目目录中,有安卓和iOS两个项目目录。
Android Studio中会列出所有已经连接了电脑的设备,包括安卓和iPhone。如果想在模拟器上运行,下面可以选择对应的模拟器,如图:
PS:如果想在模拟器上运行,需要先安装一个模拟器,选择Tools AVD Manager,如图:
然后选择Create Virtual Device,根据提示一步一步操作即可(建议翻墙条件下操作),添加完成后就可以在这个界面看到自己已经添加的模拟器,点击绿色的运行按钮,即可打开该模拟器:
花费大概一个多月的时间,这个完全由Flutter编写的Todo-List项目总算初步完成了!现在,它终于要被开源出来了。
在开始介绍之前,先来简单的看一下真机运行效果吧
下面,针对使用者和开发者,我将来分别介绍一次
app中,可以在主题切换界面选择各种主题颜色进行切换,app自带六个默认主题,这些都是我经过多次尝试所挑选出来的颜色搭配。同时你也可以选择自定义主题颜色
在app中,每项任务都会带有一个图标,而app提供了所有 Flutter 自带的 Material design 风格的图标。这些图标,你同样可以进行任意颜色的自定义
在app中,有多项其他的操作是你可以进行自定义的
比如说主页测滑栏的头部展示内容。当然,还有一些其他的操作,就由你去自行体验了
当你完成了一项任务后,这个任务就会从主页转移到完成列表页面,在这里你可以看到任务的一些额外信息
那么,对于使用者的介绍就到这里结束
下面就是为广大开发者们介绍的时间了!
各位开发者们请扶好你们的秀发,下面就我来带领各位参观参观这个项目的内部构造
项目中使用了一些非常优秀的第三方库,也特别感谢这些开发者们,让我的发量保持健康
下面就是这些控件的信息
项目使用的状态管理框架是 codeProvider/code ,而整个项目的架构如下
看起来是不是和 Android 中的 MVP 模式很像呢?其实都差不多的,只是名字略有不同罢了,你也可以就把上面的模式当作是 MVP 模式。
Flutter 可以说是特别适合这种架构模式的,因为视图跟随数据而变化,你基本上不用去关心View,只要去对数据进行操作就好了。
项目目录结构如下:
先说明一下除了 lib 外的其他目录:
然后是 lib 目录
项目创建于6月21日,到如今发布1.0.0版本花了三十多天的时间,虽然我做过很多测试,解决了很多bug,但是时间确实不充裕。纰漏也会在所难免
所以如果使用过程中遇到什么问题,或者对于项目有什么好的建议,欢迎在app中的反馈界面提出来,也可以在下面留下评论,又或者在github上提issue。
项目的UI设计与后台接口均由我独自一人完成,所以这也是为什么时间不够的原因。不过目前项目中只是包含了两个自己写的接口,后续计划中应该会加入登录功能,到时候会有很多接口操作。
若有兴趣,请持续关注!
如果你觉得这个app不错,或者这个项目有帮助到你,不妨给这个项目一个Star吧。项目后面也会持续保持更新和维护!
ToDo-List
UI项目地址
密码:Aczh
如果和我一样,用惯了VS Code来开发项目的话,那就跟我一起来配置一下如何在VS Code里运行flutter项目。
1.在VS Code里安装扩展:
2.在VScode上打开打开终端,快捷键:Ctrl+~(Tab上一个键),在终端上输入:flutter create flutter_app02,即可创建完成!
也可以把之前的项目放到工作区
3.在终端中运行命令:flutter run
运行的时候你会发现手机提示你安装个app,点击安装完成,项目就在手机上显示了,下图是运行成功的提示。
下图是手机效果:
如果报错的话,运行下清缓存的命令:flutter clean,把文件夹.gradle删掉,然后flutter run重新跑下项目。
透明视频动画是目前比较流行的实现动画的一种, 大厂也相继开源自己的框架,最终我们选中 腾讯vap ,它支持了Android、IOS、Web,为我们封装flutter_vap提供了天然的便利,并且它提供了将帧图片生成带alpha通道视频的工具,这简直太赞了。
VAP(Video Animation Player)是企鹅电竞开发,用于播放酷炫动画的实现方案。
video for youtube
video for qiniu
apk download
github