Flutter Flar animation combat

Before the appearance of the Flare moving surface, Flare animation can be roughly divided into basic animation controlled by AnimationController and transition animation using Hero. If you encounter some complex scenes, it is still difficult to implement these animation solutions. However, as Flutter began to support the Flare vector moving surface, the animation development of Flutter has become easier and simpler. In fact, Flare animation is a vector animation solution similar to Lottie. Using Flare moving surface can not only effectively reduce the size of the installation package, but also achieve complex animation effects that cannot be achieved by traditional animation solutions.

Rive is a website that specializes in making Flare vector animations. The website itself provides a lot of free Flare animations for developers to download and learn. In addition, Rive also provides tutorials on the use and production of Flare animations. In order to facilitate the learning and use of the Flare animation on the Rive website, you need to register a Rive official account first, as shown in the figure below.
insert image description hereRive creates and manages Flare animation projects in the form of projects. Currently, there are two types of Flare animation projects that can be created, namely Nima and Flare. The differences are as follows: • Nima: only
supports raster images, and is mainly used for game engines and applications. 2D animation.
• Flare: Supports vector graphics and raster graphics, mainly used to build real-time and efficient animations for mobile apps and the Web, and also supports building game animations.
Since Nima is mainly used to build 2D game animations, for Flutter application development, you only need to create a new Flare type project.
Currently, there are two main ways to create a Flare project, one is to create it on the Rive official website, and the other is to create it through the Rive client. Here is how to create a Flare project in the Rive client mode, as shown in the figure below.

Guess you like

Origin blog.csdn.net/xiangzhihong8/article/details/132076569