Tuesday, September 26, 2023

Best Flutter Library to showing loading animations

Loading or progress animation flutter

Today we are sharing a flutter package for showing some awesome loading effects without putting any extra effort.
You can use this package for implementing progress animations or use combine with Future class. There are lot of animations are available on this package .

A simple yet very customizable set of loading animations for Flutter projects.


Add the following to your pubspec.yaml file:

  loading_animations: "^2.1.0"

Then import the file to your project:

import 'package:loading_animations/loading_animations.dart';

How to use

Choose a loading animation from the list:


  • LoadingFlipping.circle()
  • LoadingFlipping.square()


  • LoadingRotating.square()

Double Flipping

  • LoadingDoubleFlipping.circle()
  • LoadingDoubleFlipping.square()

Bouncing Grid

  • LoadingBouncingGrid.circle()
  • LoadingBouncingGrid.square()


  • LoadingFilling.square()

Fading Line

  • LoadingFadingLine.circle()
  • LoadingFadingLine.square()

Bouncing Line

  • LoadingBouncingLine.circle()
  • LoadingBouncingLine.square()

Jumping Line

  • LoadingJumpingLine.circle()
  • LoadingJumpingLine.square()

Bumping Line

  • LoadingBumpingLine.circle()
  • LoadingBumpingLine.square()

Then add the following code:

  color: Colors.blue,

Or you can customize it a bit:

  borderColor: Colors.cyan,
  size: 30.0,

Or customize it even more!

  borderColor: Colors.cyan,
  borderSize: 3.0,
  size: 30.0,
  backgroundColor: Colors.cyanAccent,
  duration: Duration(milliseconds: 500),

For more customization, please look inside the loading animation files.

Note: all the animations come ready to go just by calling LoadingDoubleFlipping.square(), for example.

Many basic animations contain .circle() and .square() variations by default.


LoadingFlipCircle() LoadingRotatingSquare()
LoadingFlipBox() LoadingBouncingGrid()