🎉 Alerts - Custom Alert Dialogs for Flutter #

A powerful and flexible Flutter package that provides highly customizable alert dialogs with themes, animations, multiple buttons, and input fields. Perfect for enhancing user interactions in your Flutter applications! 🚀

✨ Features #

• 🎨 Customizable Themes: Easily customize colors, borders, padding, and more
• 🎭 Multiple Animations: Choose from fade, slide (up/left/right), scale, bounce, rotate, or no animation
• 🔘 Flexible Buttons: Support for multiple buttons with custom styles and text colors
• 📝 Input Fields: Integrated text input fields with various keyboard types
• ⏰ Auto-Close: Automatically close dialogs after a specified duration
• 🌐 Global Configuration: Set default themes, animations, and behaviors app-wide
• 📱 Responsive Design: Works seamlessly across different screen sizes
• 🛠️ Easy Integration: Simple API similar to Flutter's built-in dialogs

🚀 Quick Start #

Import the package:

import 'package:alert_plus/alert_plus.dart';

Basic Alert Dialog #

Alerts.show(
  context,
  title: 'Hello World! 🌍',
  content: 'This is a basic alert dialog.',
  buttons: [
    AlertButton(
      label: 'OK',
      onPressed: () => Navigator.of(context).pop(),
    ),
  ],
);

Advanced Alert with Multiple Buttons and Input #

Alerts.show(
  context,
  title: 'User Input Required 📝',
  content: 'Please enter your name and email.',
  inputFields: [
    AlertInputField(hintText: 'Name'),
    AlertInputField(hintText: 'Email', keyboardType: TextInputType.emailAddress),
  ],
  buttons: [
    AlertButton(
      label: 'Cancel',
      onPressed: () => Navigator.of(context).pop(),
      backgroundColor: Colors.grey,
    ),
    AlertButton(
      label: 'Submit',
      onPressed: () {
        // Handle submission
        Navigator.of(context).pop();
      },
      backgroundColor: Colors.blue,
    ),
  ],
  theme: AlertTheme(
    backgroundColor: Colors.white,
    borderRadius: BorderRadius.circular(16.0),
  ),
  animation: AlertAnimation.scale,
);

📚 API Reference #

Alerts.show<T> #

The main function to display a custom alert dialog.

AlertButton #

Represents a button in the alert dialog.

AlertInputField #

Represents an input field in the dialog.

AlertTheme #

Theme configuration for the dialog.

AlertAnimation #

Animation types for dialog appearance.

• none: No animation
• fade: Fade in effect
• slideUp: Slide from bottom
• slideLeft: Slide from left
• slideRight: Slide from right
• scale: Scale animation
• bounce: Bounce animation
• rotate: Rotate animation

AlertConfig #

Global configuration class for setting default behaviors.

🎨 Customization Examples #

Dark Theme Alert #

Alerts.show(
  context,
  title: 'Dark Mode Alert 🌙',
  content: 'This alert uses a dark theme.',
  theme: AlertTheme(
    backgroundColor: Colors.grey[900],
    titleColor: Colors.white,
    contentColor: Colors.white70,
    borderRadius: BorderRadius.circular(12.0),
  ),
  buttons: [
    AlertButton(
      label: 'Got it!',
      onPressed: () => Navigator.of(context).pop(),
      backgroundColor: Colors.blueAccent,
    ),
  ],
);

Animated Alert with Custom Content #

Alerts.show(
  context,
  contentWidget: Column(
    children: [
      Icon(Icons.warning, size: 48, color: Colors.orange),
      SizedBox(height: 16),
      Text('Custom content with icon!'),
    ],
  ),
  animation: AlertAnimation.slideUp,
  buttons: [
    AlertButton(label: 'Dismiss', onPressed: () => Navigator.of(context).pop()),
  ],
);

Auto-Close Alert #

Alerts.show(
  context,
  title: 'Success!',
  content: 'Operation completed successfully.',
  autoCloseDuration: Duration(seconds: 3), // Closes after 3 seconds
  buttons: [
    AlertButton(
      label: 'Close Now',
      onPressed: () => Navigator.of(context).pop(),
    ),
  ],
);

Global Configuration #

// Set global defaults
AlertConfig.defaultTheme = AlertTheme(
  backgroundColor: Colors.grey[900],
  titleColor: Colors.white,
  borderRadius: BorderRadius.circular(16.0),
);

AlertConfig.defaultAnimation = AlertAnimation.bounce;
AlertConfig.defaultAutoCloseDuration = Duration(seconds: 5);

// Now all alerts will use these defaults unless overridden
Alerts.show(
  context,
  title: 'Configured Alert',
  content: 'This uses global configuration.',
);

🤝 Contributors #

Have you found a bug or have a suggestion of how to enhance Alerts Package? Open an issue or pull request and we will take a look at it as soon as possible.

🐛 Report bugs or issues #

You are welcome to open a ticket on github if any problems arise. New ideas are always welcome.

📄 Copyright and License #

Copyright © 2025 Rohit Chouhan. Licensed under the MIT LICENSE.

Made with ❤️ for the Flutter community!