Flutter Multiple Loaders #

A Flutter package providing a collection of customizable loading animations for your Flutter applications.

Screenshots #

Here are examples of the different loaders included in this package:

Features #

This package includes multiple loading animation styles with customizable properties:

• Spinner Loader: A classic spinning circular loader
• Pulse Loader: A circle that pulses in and out
• Bounce Loader: Multiple dots that bounce up and down
• Wave Loader: Multiple bars that animate in a wave-like pattern
• Circle Loader: A circular progress indicator with customizable properties
• Dots Loader: Multiple dots that fade in and out in sequence
• Rotating Square Loader: A square that rotates on its center axis

All loaders feature:

• Customizable sizes (extra small to extra large)
• Custom colors (primary, secondary, and tertiary)
• Adjustable animation speed
• Optional background colors
• Animation control (start, stop, reset)

Getting started #

Add the dependency to your pubspec.yaml:

dependencies:
  flutter_multiple_loaders: ^0.0.1

Then run:

flutter pub get

Usage #

Import the package:

import 'package:flutter_multiple_loaders/flutter_multiple_loaders.dart';

Basic Usage #

Use any of the loaders with default options:

// Simple spinner animation
SpinnerLoader();

// Pulse animation
PulseLoader();

// Bounce animation 
BounceLoader();

// Wave animation
WaveLoader();

// Circle animation
CircleLoader();

// Dots animation
DotsLoader();

Customizing Loaders #

All loaders accept custom options through the LoaderOptions class:

// Customized spinner loader
SpinnerLoader(
  options: LoaderOptions(
    color: Colors.purple,
    size: LoaderSize.large,
    durationMs: 1000,
    loop: true,
  ),
);

// Multi-colored wave loader
WaveLoader(
  barCount: 5,
  options: LoaderOptions(
    color: Colors.blue,
    secondaryColor: Colors.green,
    tertiaryColor: Colors.orange,
    size: LoaderSize.medium,
  ),
);

Controlling Animation Programmatically #

Use the LoaderController to control the animation:

class _MyWidgetState extends State<MyWidget> {
  final LoaderController _controller = LoaderController();
  
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        SpinnerLoader(controller: _controller),
        
        ElevatedButton(
          onPressed: () => _controller.start(),
          child: Text('Start'),
        ),
        
        ElevatedButton(
          onPressed: () => _controller.stop(),
          child: Text('Stop'),
        ),
        
        ElevatedButton(
          onPressed: () => _controller.reset(),
          child: Text('Reset'),
        ),
      ],
    );
  }
}

Interactive Example #

The package includes a complete example app that demonstrates all loaders with interactive controls for customization:

The example app allows you to:

• Switch between different loader types
• Change sizes and colors
• Control animation duration
• Start, stop, and reset animations

Check the example folder for more detailed usage examples.

Additional information #

Contributing #

Contributions are welcome! Feel free to open an issue or submit a pull request.

License #

This package is licensed under the MIT License - see the LICENSE file for details.