You’ve probably seen hero animations many times. For example, a screen displays
a list of thumbnails representing items for sale.  Selecting an item flies it to
a new screen, containing more details and a “Buy” button. Flying an image from
one screen to another is called a hero animation in Flutter, though the same
motion is sometimes referred to as a shared element transition.

You might want to watch this one-minute video introducing the Hero widget:

This guide demonstrates how to build standard hero animations, and hero
animations that transform the image from a circular shape to a square shape
during flight.

Examples: This guide provides examples of each hero animation style at
  the following links.

Standard hero animation code

Radial hero animation code

New to Flutter?
  This page assumes you know how to create a layout
  using Flutter’s widgets. For more information, see
  Building Layouts in Flutter.