zeba_academy_loading #

A lightweight and customizable Flutter loading package with multiple animated loading indicators.

zeba_academy_loading provides a simple, dependency-free API for displaying beautiful loading animations in Flutter applications.

Features #

• 🔄 Spinner loader
• 💓 Pulse loader
• 🔵 Dots loader
• 🌊 Wave loader
• 📊 Bar loader
• 🎨 Custom colors
• ⚙️ Custom sizes
• ⏱️ Custom animation durations
• 🔢 Configurable dot and bar counts
• 🧩 Individual loader widgets
• 🎯 Unified ZebaLoading widget
• 🚫 No external dependencies
• 📱 Works with Flutter applications
• 🧪 Tested with Flutter widget tests

Installation #

Add the package to your pubspec.yaml:

dependencies:
  zeba_academy_loading: ^0.0.1

Then run:

flutter pub get

Import #

import 'package:zeba_academy_loading/zeba_academy_loading.dart';

Quick Start #

The easiest way to use the package is with the ZebaLoading widget:

const ZebaLoading()

By default, this displays a spinner loader.

Loading Types #

The package provides five loading types:

enum ZebaLoadingType {
  spinner,
  pulse,
  dots,
  wave,
  bar,
}

Spinner Loader #

A classic circular loading indicator:

const ZebaLoading(
  type: ZebaLoadingType.spinner,
)

Custom Spinner #

const ZebaLoading(
  type: ZebaLoadingType.spinner,
  size: 40,
  strokeWidth: 4,
)

Pulse Loader #

A smooth pulsing circle animation:

const ZebaLoading(
  type: ZebaLoadingType.pulse,
)

Custom Pulse #

const ZebaLoading(
  type: ZebaLoadingType.pulse,
  size: 48,
  color: Colors.deepPurple,
)

Dots Loader #

A bouncing dots animation:

const ZebaLoading(
  type: ZebaLoadingType.dots,
)

Custom Dots #

const ZebaLoading(
  type: ZebaLoadingType.dots,
  count: 4,
  dotSize: 10,
  spacing: 8,
  color: Colors.blue,
)

Wave Loader #

An animated wave made from vertical bars:

const ZebaLoading(
  type: ZebaLoadingType.wave,
)

Custom Wave #

const ZebaLoading(
  type: ZebaLoadingType.wave,
  size: 44,
  count: 6,
  spacing: 5,
  color: Colors.green,
)

Bar Loader #

A horizontal animated loading bar:

const ZebaLoading(
  type: ZebaLoadingType.bar,
  size: 120,
)

Custom Bar #

const ZebaLoading(
  type: ZebaLoadingType.bar,
  size: 150,
  dotSize: 6,
  color: Colors.orange,
  backgroundColor: Colors.black12,
)

Custom Colors #

All loaders support custom colors:

const ZebaLoading(
  type: ZebaLoadingType.spinner,
  color: Colors.deepPurple,
)

const ZebaLoading(
  type: ZebaLoadingType.pulse,
  color: Colors.red,
)

const ZebaLoading(
  type: ZebaLoadingType.dots,
  color: Colors.blue,
)

const ZebaLoading(
  type: ZebaLoadingType.wave,
  color: Colors.green,
)

Custom Animation Duration #

Control the speed of the animations:

const ZebaLoading(
  type: ZebaLoadingType.spinner,
  duration: Duration(milliseconds: 700),
)

Slower animation:

const ZebaLoading(
  type: ZebaLoadingType.wave,
  duration: Duration(milliseconds: 1500),
)

Direct Loader Widgets #

You can also use individual loader widgets directly.

Spinner #

const ZebaSpinnerLoader(
  size: 40,
  strokeWidth: 4,
)

Pulse #

const ZebaPulseLoader(
  size: 48,
)

Dots #

const ZebaDotsLoader(
  count: 4,
  dotSize: 10,
  spacing: 8,
)

Wave #

const ZebaWaveLoader(
  height: 40,
  count: 5,
)

Bar #

const ZebaBarLoader(
  width: 160,
  height: 6,
)

Complete Example #

import 'package:flutter/material.dart';
import 'package:zeba_academy_loading/zeba_academy_loading.dart';

void main() {
  runApp(const LoadingExampleApp());
}

class LoadingExampleApp extends StatelessWidget {
  const LoadingExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Zeba Academy Loading',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(
          seedColor: Colors.deepPurple,
        ),
        useMaterial3: true,
      ),
      home: const LoadingExamplePage(),
    );
  }
}

class LoadingExamplePage extends StatelessWidget {
  const LoadingExamplePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Loading Examples'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const ZebaLoading(
              type: ZebaLoadingType.spinner,
            ),
            const SizedBox(height: 32),
            const ZebaLoading(
              type: ZebaLoadingType.pulse,
              color: Colors.deepPurple,
            ),
            const SizedBox(height: 32),
            const ZebaLoading(
              type: ZebaLoadingType.dots,
              color: Colors.blue,
            ),
            const SizedBox(height: 32),
            const ZebaLoading(
              type: ZebaLoadingType.wave,
              color: Colors.green,
            ),
            const SizedBox(height: 32),
            const ZebaLoading(
              type: ZebaLoadingType.bar,
              size: 120,
              color: Colors.orange,
            ),
          ],
        ),
      ),
    );
  }
}

API Overview #

ZebaLoading #

Available Widgets #

ZebaLoading
ZebaSpinnerLoader
ZebaPulseLoader
ZebaDotsLoader
ZebaWaveLoader
ZebaBarLoader

Available Loading Types #

ZebaLoadingType.spinner
ZebaLoadingType.pulse
ZebaLoadingType.dots
ZebaLoadingType.wave
ZebaLoadingType.bar

Why Use This Package? #

Flutter applications frequently need loading indicators for:

• API requests
• Page transitions
• Authentication
• File uploads
• Data fetching
• Button loading states
• Background operations
• Empty states
• Custom UI components

Instead of creating individual animations for every project, zeba_academy_loading provides a simple collection of reusable loading animations with a consistent API.

Performance #

This package is designed to be lightweight:

• No external dependencies
• Uses Flutter's built-in animation APIs
• Uses AnimationController efficiently
• Properly disposes animation controllers
• Supports const constructors where possible

Requirements #

• Flutter >=1.17.0
• Dart ^3.12.0

License #

This project is licensed under the GNU General Public License v3.0.

You are free to:

• Use the software
• Study the source code
• Modify the source code
• Share the software
• Distribute modified versions

Under the terms of the GPL v3 license.

See the LICENSE file for the complete license text.

About Me #

✨ I’m Sufyan bin Uzayr, an open-source developer passionate about building and sharing meaningful projects.

You can learn more about me and my work at sufyanism.com or connect with me on LinkedIn.

Your All-in-One Learning Hub #

🚀 Explore courses and resources in coding, technology, and development at Zeba Academy.

Empower yourself with practical skills through curated tutorials, real-world projects, and hands-on experience. Level up your tech game today! 💻✨

Zeba Academy is a learning platform dedicated to coding, technology, and development.

➡ Visit our main site: zeba.academy

➡ Explore hands-on courses and resources at: code.zeba.academy

➡ Check out our YouTube for more tutorials: zeba.academy

➡ Follow us on Instagram: zeba.academy

Thank you for visiting! ✨

Made with ❤️ for the Flutter community by Zeba Academy.