Note

AnimatedBuilder, Transform, AnimationController, Animation and Tween

Introduction

Animations are an important part of building fluid and modern user interfaces in mobile or web applications.

<aside> 💡 It’s all Math

</aside>

Understanding Dimensions in Flutter

Origin and Coordinate axes in flutter

Angles and gradients

Implicit Animation

Explicit Animation

Page Route Builder

CustomPaint Widget

Unlike native frameworks, Flutter underneath does not use OS views. Instead, Flutter paints the entire app on a canvas underneath the whole app.

While the Canvas underneath the app is not directly available for mutation without creating our RenderObject, the CustomPaint widget provides a Canvas for you to use.

The primary use of the CustomPaint widget is that it provides low-level API access allowing you to create custom designs that would not easily be possible with simple widgets provided out of the box.

CustomPaint is split into two parts: the widget and the painter.

• The widget itself takes in a child widget which determines the size of the CustomPaint widget and the Canvas associated with it.
• The painter is an implementation of the CustomPainterclass, dictates the instructions to perform on the canvas.

Custom Painter