41 cool Loading components library

At present, there are 41 animation components in the loading library, and more will be added. At the same time, you are welcome to submit your own loading animation components or send them to me directly via wechat.

Github address: github.com/781238222/f…

The effect is as follows:

Add dependencies to the project’s pubspec.yaml file:

dependencies:
  m_loading: ^0.01.
Copy the code

Execute command:

flutter pub get
Copy the code

The usage of all loading animation components is similar, with duration and curve parameters, as well as the appearance and style Settings. The following are some uses of loading animation components.

The animation component of the small ball has a parameter of type BallStyle, which represents the style of the ball. The usage is as follows:

BallCircleOpacityLoading(
  ballStyle: BallStyle(
    size: 5,
    color: Colors.red,
    ballType: BallType.solid,
  ),
)
Copy the code

Size: indicates the size of a small ball
Color: indicates the color of the ball
A ballType, hollow, solid
BorderWidth: borderWidth
BorderColor: borderColor

Set the hollow ball:

BallCircleOpacityLoading(
  ballStyle: BallStyle(
    size: 5,
    ballType: BallType.hollow,
    borderWidth: 1,
    borderColor: Colors.red
  ),
)
Copy the code

Set animation duration and animation curve:

Ring2InsideLoading(
  color: Colors.blue,
  duration: Duration(milliseconds: 1200),
  curve: Curves.bounceInOut,
)
Copy the code

Non-ball components use:

PacmanLoading(
  mouthColor: Colors.blue,
  ballColor: Colors.red,
)
Copy the code

PouringHourGlassLoading(
  color: Colors.blue,
)
Copy the code

The usage is basically the same. Here are the effects of all animation components and their corresponding component names:


BallPulseLoading	Ball4ScaleLoading	BallGridPulseLoading	BallCirclePulseLoading

Ball3OpacityLoading	Ball4OpacityLoading	BallGridOpacityLoading	BallCircleRotateLoading

BallBounceLoading	BallRotateScaleLoading	Ball2TrianglePathLoading	BallCircleOpacityLoading

Ball3TrianglePathLoading	BallInsideBallLoading	BallClipRotatePulseLoading	BallCircleInsideRotateLoading

RingRotate	Ring2InsideLoading	Ring2SymmetryLoading	RingBallRotateLoading

RingClipRotateMultiple	WaterCircleLoading	Water2CircleLoading	WaterRipple

WaterMultipleCircleLoading	WaterPulseLoading	BarPulseLoading	BarScaleLoading

BarScale1Loading	BarScalePulseOutLoading	BarMusicLoading	Square4OpacityLoading

SquareFadingLoading	SquareRotateLoading	SquareGridScaleLoading	CircleRotateLoading

CirclePulseLoading	CircleSquareLoading	Circle2InsideScaleLoading	PouringHourGlassLoading

PacmanLoading