DISCOVER FLUTTER — WEEK #25

Animations Flutter Package

Contains animations for commonly-desired effects

Jelena Jovanoski
3 min readFeb 16, 2021

--

Photo by Casey Horner on Unsplash

The Flutter team last year shipped a new stable version of its cross-platform mobile framework. This new version includes a lot of new features, and in this article, I want to pay attention to its animations package.

This package allows developers to implement commonly desired animation patterns in mobile app development.

There are currently four transition patterns available in the package:

  1. Container transform
  2. Shared axis transition
  3. Fade through transition
  4. Fade transition

Container Transform

According to the specification the container transform pattern is designed for transitions between UI elements that include a container. This pattern creates a visible connection between two UI elements.

The container is the main element that holds the outgoing and incoming elements and whose dimensions and position change, in other words, it is a container that grows to fill the screen to reveal new content when tapped. Similar to a Hero widget.

--

--

Jelena Jovanoski

On my journey to become a Flutter dev I will be sharing knowledge by writing short texts about what new know-how’s I’ve learned, in the next 30 weeks.