Animation in flutter

Bhoomi Prajapati
2 min readAug 1, 2020

--

There are two types of animations in Flutter. Implicit and Explicit. Let’s talk about what is the difference between them and how to use them.

The animation is some frames per second. Mostly in flutter animation, there are 60 frames per second. If these frames are handled by the flutter AnimatedWidgets then it is implicit animation. There are animation widgets like AnimatedContainer, AnimatedSwitcher, AnimatedOpacity, etc. are used for implicit animations.

Now, when to use implicit animations?

Depending on the certain condition you want to change the layout of your screen. For example, on tapping the button you want to change the opacity of the widget or change the previous widget with a new one with animation you can use the implicit animation with flutter’s “AnimatedFoo” widgets.

Explicit widgets, on the other hand, requires you to give the controller and start it by code. As the name suggests we need to manage these animations explicitly. We need to provide a Ticker, that is responsible for managing the frames, an animation controller that uses a ticker and helps to play an animation. You will have to dispose the animation controller when the screen is no longer in use.

If there is only one explicit animation the use SingleTickerProviderStateMixin otherwise the TickerProviderStateMixin.

When to use explicit animations?

For example, you have to make a splash screen with animation. In that case, you can use explicit animation by providing forward or reverse to play the animation when the screen is loaded, provide the duration, and when the screen goes off the context dispose the controller.

What is the difference?

In Implicit animations, everything from managing the frame to disposing it managed by flutter itself. Whereas in explicit one, we will have to manage by providing the ticker, animation controller, when to start and also the duration of the animation.

There are videos on Flutter’s YouTube channel about implicit and explicit animations. You can go there and check it, it’ll help you more to understand the topic.

--

--

No responses yet