DoAnimate 🎭 #

A comprehensive Flutter animation package that provides beautiful, ready-to-use animation widgets for your Flutter applications. Make your UI come alive with smooth, performant animations!

✨ Features #

• 🎨 14 Pre-built Animations - Ready to use out of the box
• 🚀 High Performance - Optimized animations using Flutter's native APIs
• 🎯 Super Easy to Use - One widget, just pick an animation type!
• 🛠️ Highly Customizable - Control duration, curves, delays, and more
• 📱 Cross-platform - Works on iOS, Android, Web, and Desktop
• ⚡ Single Widget API - No need to remember different widget names

📦 Installation #

Add this to your package's pubspec.yaml file:

dependencies:
  do_animate: ^1.0.0

Then run:

flutter pub get

🎬 All 14 Animations - One Simple Widget! #

Simply use DoAnimateWidget and choose from 14 animation types using the AnimationType enum:

✅ All Animations Work Through DoAnimateWidget #

Every single animation is accessible through the DoAnimateWidget - just change the animationType!

// ANY animation - same simple syntax!
DoAnimateWidget(
  animationType: AnimationType.fadeIn,  // Pick any from 14 types!
  child: Text('Hello World'),
)

💡 Examples - All Animations Work the Same Way! #

// 1. Fade In
DoAnimateWidget(
  animationType: AnimationType.fadeIn,
  child: Text('Fading in'),
)

// 2. Slide from Left
DoAnimateWidget(
  animationType: AnimationType.slideFromLeft,
  child: Text('Sliding in'),
)

// 3. Scale In
DoAnimateWidget(
  animationType: AnimationType.scaleIn,
  child: Icon(Icons.favorite),
)

// 4. Bounce (continuous)
DoAnimateWidget(
  animationType: AnimationType.bounce,
  config: AnimationConfig(offset: 30.0),
  child: Icon(Icons.star),
)

// 5. Rotate (continuous)
DoAnimateWidget(
  animationType: AnimationType.rotate,
  child: Icon(Icons.refresh),
)

// 6. Shimmer (for loading)
DoAnimateWidget(
  animationType: AnimationType.shimmer,
  child: Container(width: 200, height: 20, color: Colors.white),
)

// 7. Using Preset Configs
DoAnimateWidget(
  animationType: AnimationType.fadeIn,
  config: AnimationConfig.fast(),  // or .slow(), .bouncy()
  child: Text('Fast animation!'),
)

🚀 Quick Start - Easy API #

The easiest way to use DoAnimate is with DoAnimateWidget - just pick an animation type!

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

// Simple - just choose an AnimationType!
DoAnimateWidget(
  animationType: AnimationType.fadeIn,
  child: Text('Hello World'),
)

// With custom duration
DoAnimateWidget(
  animationType: AnimationType.bounce,
  config: AnimationConfig(
    duration: Duration(seconds: 2),
    offset: 30.0,
  ),
  child: Icon(Icons.star),
)

// Use predefined configs
DoAnimateWidget(
  animationType: AnimationType.scaleIn,
  config: AnimationConfig.fast(), // or .slow(), .bouncy()
  child: Container(...),
)

Available Animation Types #

AnimationType.fadeIn
AnimationType.slideFromLeft
AnimationType.slideFromRight
AnimationType.slideFromTop
AnimationType.slideFromBottom
AnimationType.scaleIn
AnimationType.blinking
AnimationType.bounce
AnimationType.rotate
AnimationType.wave
AnimationType.pulse
AnimationType.shake
AnimationType.shimmer
AnimationType.fadeSlide

🎯 Complete Example #

Here's a complete example showing multiple animations:

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

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('DoAnimate Example')),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              // Easy API - Just choose animation type!
              DoAnimateWidget(
                animationType: AnimationType.fadeIn,
                child: Text('Fading In', style: TextStyle(fontSize: 24)),
              ),
              SizedBox(height: 20),
              DoAnimateWidget(
                animationType: AnimationType.slideFromLeft,
                child: Text('Sliding From Left', style: TextStyle(fontSize: 24)),
              ),
              SizedBox(height: 20),
              DoAnimateWidget(
                animationType: AnimationType.scaleIn,
                config: AnimationConfig.bouncy(),
                child: Text('Scaling In', style: TextStyle(fontSize: 24)),
              ),
              SizedBox(height: 40),
              DoAnimateWidget(
                animationType: AnimationType.rotate,
                child: Icon(Icons.refresh, size: 48),
              ),
              SizedBox(height: 20),
              DoAnimateWidget(
                animationType: AnimationType.bounce,
                config: AnimationConfig(offset: 25.0),
                child: Icon(Icons.star, size: 48, color: Colors.amber),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

🎨 Full Customization Options #

All 14 animations support the same AnimationConfig customization:

DoAnimateWidget(
  animationType: AnimationType.fadeIn, // Works with ANY animation type!
  config: AnimationConfig(
    duration: Duration(seconds: 1),
    curve: Curves.elasticOut,
    delay: Duration(milliseconds: 200),
  ),
  child: YourWidget(),
)

📝 AnimationConfig Properties: #

⚡ Quick Preset Configs: #

AnimationConfig.fast()    // 300ms, easeOut - snappy animations
AnimationConfig.slow()    // 1200ms, easeInOut - smooth, gentle
AnimationConfig.bouncy()  // 800ms, elasticOut - fun, playful

🔄 Animation Types #

One-time Animations #

Play once when the widget is built:

• AnimationType.fadeIn
• AnimationType.slideFromLeft/Right/Top/Bottom
• AnimationType.scaleIn
• AnimationType.fadeSlide
• AnimationType.shake

Continuous Animations #

Loop indefinitely:

• AnimationType.blinking
• AnimationType.bounce
• AnimationType.rotate

🔄 Animation Categories #

✨ One-time Animations (8 types) #

Play once when the widget is built:

🌟 Best Practices #

1. Sequential Animations with Delays #

Column(
  children: [
    DoAnimateWidget(
      animationType: AnimationType.fadeIn,
      child: Widget1(),
    ),
    DoAnimateWidget(
      animationType: AnimationType.fadeIn,
      config: AnimationConfig(delay: Duration(milliseconds: 200)),
      child: Widget2(),
    ),
    DoAnimateWidget(
      animationType: AnimationType.fadeIn,
      config: AnimationConfig(delay: Duration(milliseconds: 400)),
      child: Widget3(),
    ),
  ],
)

2. Loading States with Shimmer #

isLoading
  ? DoAnimateWidget(
      animationType: AnimationType.shimmer,
      child: Container(width: 200, height: 20, color: Colors.grey[300]),
    )
  : Text(actualData)

3. Choose the Right Animation #

• Subtle entrance → fadeIn
• Navigation → slideFromLeft/Right
• Attention → bounce, pulse, blinking
• Loading → shimmer
• Error feedback → shake
• Success → scaleIn with bouncy config
• Background elements → wave, rotate

📄 License #

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

💬 Support #

If you have any questions or issues, please file an issue on GitHub.

⭐ Show Your Support #

If you like this package, please give it a ⭐ on GitHub and a 👍 on pub.dev!

Made by Jeevan Kumar Kushwaha with ❤️ for the Flutter community