蘑菇云软件学习Flutter课程第二课来啦,这周日我们接着上一周的课程,继续学习Flutter。提前预告一下,本期Flutter课程将持续4次课程,这周日为第二课。整期课程结束你将学会如何做一个完整的APP(不包含服务器)。
01
第一课回顾
上周我们已经学习了Flutter的发展及优势,并且编辑了第一个Flutter页面。
学员成果图
这周我们来学习,当页面变的更多的时候,页面的切换及其交互效果。
培训内容:
Part 1
学习如何制作多页面的App,并且掌握页面跳转的管理转换效果机理
Part 2
理解页面转换效果,并实践多种页面转换效果
Part 3
使用Hero Widget实现专业的交互效果
02
什么是路由管理
路由(Route)在移动开发中通常指页面(Page),这跟web开发中单页应用的Route概念意义是相同的,Route在Android中通常指一个Activity,在iOS中指一个ViewController。所谓路由管理,就是管理页面之间如何跳转,通常也可被称为导航管理。这和原生开发类似,无论是Android还是iOS,导航管理都会维护一个路由栈,路由入栈(push)操作对应打开一个新页面,路由出栈(pop)操作对应页面关闭操作,而路由管理主要是指如何来管理路由栈。
03
什么是页面转换的动画
在任何系统的UI框架中,动画实现的原理都是相同的,即:在一段时间内,快速地多次改变UI外观,由于人眼会产生视觉暂留,最终看到的就是一个“连续”的动画,这和电影的原理是一样的,而UI的一次改变称为一个动画帧,对应一次屏幕刷新,而决定动画流畅度的一个重要指标就是帧率FPS(Frame Per Second),指每秒的动画帧数。很明显,帧率越高则动画就会越流畅。一般情况下,对于人眼来说,动画帧率超过16FPS,就比较流畅了,超过32FPS就会非常的细腻平滑,而超过32FPS基本就感受不到差别了。由于动画的每一帧都是要改变UI输出,所以在一个时间段内连续的改变UI输出是比较耗资源的,对设备的软硬件系统要求都较高,所以在UI系统中,动画的平均帧率是重要的性能指标,而在Flutter中,理想情况下是可以实现60FPS的,这和原生应用动画基本是持平的。
04
什么是Hero动画
Hero指的是可以在路由(页面)之间“飞行”的widget,简单来说Hero动画就是在路由切换时,有一个共享的Widget可以在新旧路由间切换,由于共享的Widget在新旧路由页面上的位置、外观可能有所差异,所以在路由切换时会逐渐过渡,这样就会产生一个Hero动画。
你可能多次看到过 hero 动画。例如,一个路由中显示待售商品的缩略图列表,选择一个条目会将其跳转到一个新路由,新路由中包含该商品的详细信息和“购买”按钮。在Flutter中将图片从一个路由“飞”到另一个路由称为hero动画,尽管相同的动作有时也称为 共享元素转换。
05
提前安装开发环境
此次课程需要自带电脑,并且一定提前安装好开发环境。并且电脑系统要求为win10、mac、linux。特别注意不可以是win7,以免发生无法运行的情况。
Windows环境:
https://flutterchina.club/setup-windows/
Mac OS环境:
https://flutterchina.club/setup-macos/
官方课程:
https://codelabs.flutter-io.cn/
注意事项
1、对软件学习感兴趣就可以参与进来,我们欢迎没有基础的小白。
2、需要自带电脑,win10/mac/linux系统
3、必须提前安装好开发环境
4、我们都是个人爱好者,欢迎更多的爱好者加入。
时间:2019-07-21 16:00 - 18:00
地址:上海市浦东新区博云路111号 B1
温馨
提醒
蘑菇云创客空间正在进行空间的整理,希望各位会员尽快取回或标注个人物品,无人认领的物品默认由空间处理,谢谢大家配合!
2013年11月9日蘑菇云首次对外开放,这是浦东第一家创客空间。【蘑菇云开放夜】每周在浦东(周四)、DIY、工作坊等创客方式向社会大众开放,让所有人感受自由自造的魅力,分享创造的喜悦!
蘑菇云创客空间
自由自造的
分享、学习

