Member-only story
Introduction to Flutter Animations Using AnimatedContainer
Bring your Flutter app to life
In this post, we are going to look at AnimatedContainer and how it can be used to perform animations in Flutter apps.
AnimatedContainer
There are several ways of performing animation in Flutter, but AnimatedContainer is probably one of the simplest.
The idea is to wrap your widgets inside a container (AnimatedContainer) and update the properties of AnimatedContainer over a period of time. These properties include height, width, color, borderRadius, border, etc.
Note: The transform and child property of AnimatedContainer cannot be animated.
Although this may feel limited, in nature you can combine and animate multiple properties to create interesting animations.
Getting Started
Let’s start by creating the basic layout of our application. This will consist of a button and a Container as shown in the implementation below:
