在Flare动面出现之前,Flare动画大体可以分为使用AnimationController控制的基础动画以及使用Hero的转场动画,如果遇到一些复杂的场景,使用这些动画方案实现起来还是有难度的。不过,随着Flutter开始支持Flare矢量动面,Flutter的动画开发也变得越来越简单。事实上,Flare动画是一种类似于Lottie的矢量动画方案,使用Flare动面不仅可以有效减少安装包的体积,还能实现传统动画方案无法实现的复杂动画效果。
Rive是一个专业制作Flare矢量动画的网站,网站本身提供了很多免费Flare动画供开发者下载学习。除此之外,Rive还提供了Flare动画的使用和制作教程。为了便于学习和使用Rive网站的Flare动画,需要先注册一个Rive官方账号,如下图所示。
Rive以工程形式来创建和管理Flare动画项目,目前支持创建的Flare动画项目类型有两类,分别是Nima和Flare,区别如下:
• Nima:仅支持光栅图,主要用来为游戏引擎和应用构建2D动画。
• Flare:支持矢量图与光栅图,主要用来为移动App和Web构建实时、高效的动画,同时还支持构建游戏动画。
由于Nima主要用于构建2D游戏动画,所以对于Flutter应用开发来说,只需要新建一个Flare类型的项目即可。
目前,创建Flare项目主要有两种方式,一种是在Rive官网中进行创建,另一种则是通过Rive的客户端进行创建。此处以Rive客户端方式来说明如何创建Flare项目,如下图所示。