Hero animations

UI

Animations

Hero

Basic structure of a hero animation

Behind the scenes

Essential classes

Standard hero animations

What’s going on?
PhotoHero class
HeroAnimation class

Radial hero animations

What’s going on?
Photo class
RadialExpansion class

What you’ll learn

The hero refers to the widget that flies between screens.

Create a hero animation using Flutter’s Hero widget.

Fly the hero from one screen to another.

Animate the transformation of a hero’s shape from circular to
rectangular while flying it from one screen to another.

The Hero widget in Flutter implements a style of animation
commonly known as shared element transitions or
shared element animations.