custom_snackbar_plus 8.0.0

A powerful, intelligent, and customizable notification system for Flutter applications with auto-detection, progress bars, and multiple display modes.

Custom Snackbar 📱✨

A powerful, intelligent, and customizable notification system for Flutter applications with auto-detection, progress bars, and multiple display modes.

✨ Features

🤖 Intelligent Auto Mode

• Smart Content Analysis: Automatically detects notification type (error, success, warning, info) from message content
• Auto-Styling: Applies appropriate colors, icons, and titles based on detected type
• Smart Positioning: Shows important notifications as banners at top, regular ones as snackbars at bottom

🎨 Multiple Display Modes

• Classic Snackbar: Bottom-positioned floating notifications
• Banner Notifications: Top-positioned important alerts with higher visibility

⏱️ Progress Bar Indicator

• Visual Countdown: Shows animated progress bar indicating time until auto-dismiss
• Customizable Duration: Set any duration for notifications

📋 Multiple Notifications Support

• Smart Queuing: Handles multiple notifications sequentially
• Non-Overlapping: Each notification waits for the previous one to complete

🎭 Dynamic Icons

• Context-Aware: Different close button icons based on notification type
  • ❌ Error: Red X mark
  • ✅ Success: Green checkmark
  • ⚠️ Warning: Orange exclamation mark
  • ℹ️ Info: Blue information symbol

🎯 Full Customization

• Colors: Custom background and icon colors
• Typography: Custom titles and messages
• Actions: Optional action buttons with callbacks
• Timing: Configurable display duration
• Styling: Border radius, padding, and more

💡 Why CustomSnackbar?

• 🧠 Intelligent: Detects and styles notifications automatically.
• ⚙️ Flexible: Works with both manual and automatic modes.
• 💎 Beautiful: Smooth animations and modern design.

🚀 Installation

Add custom_snackbar_plus to your pubspec.yaml:

dependencies:
  custom_snackbar_plus: ^7.0.0

Run flutter pub get to install.

📖 Usage

Import the package:

import 'package:custom_snackbar_plus/custom_snackbar_plus.dart';

Basic Manual Usage:

CustomSnackbar.show(
  context: context,
  label: "This is an error message!",
  title: "Error",
  color: Colors.red,
  svgColor: Colors.white,
  actionLabel: "Retry",
  onAction: () {
    // Handle action
  },
);

🤖 Auto Mode (Recommended):

Simply provide the message and let the system handle the rest!

// Error notification
CustomSnackbar.show(
  context: context,
  label: "Failed to save data due to network error",
  mode: NotificationMode.auto, // Magic happens here!
);

// Success notification
CustomSnackbar.show(
  context: context,
  label: "Data saved successfully",
  mode: NotificationMode.auto,
);

// Warning notification
CustomSnackbar.show(
  context: context,
  label: "Warning: Battery low",
  mode: NotificationMode.auto,
);

// Info notification
CustomSnackbar.show(
  context: context,
  label: "New update available",
  mode: NotificationMode.auto,
);

⏱️ With Progress Bar:

CustomSnackbar.show(
  context: context,
  label: "Uploading file...",
  title: "Upload",
  showProgress: true, // Shows animated progress bar
  duration: Duration(seconds: 10),
);

🎨 Advanced Customization:

CustomSnackbar.show(
  context: context,
  label: "Custom styled notification",
  title: "Custom",
  color: Colors.purple,
  svgColor: Colors.purple.shade300,
  padding: 20,
  radius: 25,
  type: SnackbarType.success,
  showProgress: true,
  duration: Duration(seconds: 7),
  actionLabel: "View Details",
  onAction: () {
    // Handle action
  },
);

📋 API Reference

CustomSnackbar.show() Parameters:

Parameter	Type	Default	Description
context	BuildContext	Required	Build context for displaying the notification
label	String	Required	Main message text
title	String?	"Aw, Snap!"	Optional title text
padding	double	16	Content padding
radius	double	20	Border radius
color	Color	Colors.red	Background color
svgColor	Color	Colors.red[300]	Icon accent color
actionLabel	String?	null	Action button text
onAction	VoidCallback?	null	Action button callback
type	SnackbarType	SnackbarType.error	Notification type (manual mode)
showProgress	bool	false	Show progress bar indicator
duration	Duration	Duration(seconds: 5)	Display duration
mode	NotificationMode	NotificationMode.manual	Manual or auto mode

Enums:

SnackbarType

• error: Error notifications (red with X icon)
• success: Success notifications (green with checkmark)
• warning: Warning notifications (orange with exclamation)
• info: Info notifications (blue with info icon)

NotificationMode

• manual: Full control over styling and behavior
• auto: Intelligent auto-detection and styling

DisplayMode (Internal)

• snackbar: Bottom-positioned notification
• banner: Top-positioned notification

🎮 Live Demo

Run the example app to see all features in action:

cd example
flutter run

The demo includes:

• Auto mode examples with different content types
• Manual customization examples
• Progress bar demonstrations
• Multiple notification queuing
• Banner vs Snackbar comparisons

📸 Screenshots

Manual Mode Examples

• Custom Snackbar:
• Info Snackbar:
• Warning Snackbar:
• Success Snackbar:
• Error Snackbar:
• Progress Snackbar:

Auto Mode Examples

• Auto Error Snackbar:
• Auto Success Snackbar:
• Auto Warning Banner:
• Auto Info Banner:

🤖 Auto Mode Intelligence

The auto mode analyzes your message content using these keywords:

Error Detection:

• "error", "fail"

Success Detection:

• "success", "done"

Warning Detection:

• "warning", "caution"

Info Detection:

• "info", "information"

Based on detected type, it automatically applies:

• Appropriate colors and icons
• Suitable display mode (banner for warnings/info)
• Contextual titles

🎯 Use Cases

E-commerce Apps

CustomSnackbar.show(
  context: context,
  label: "Order placed successfully!",
  mode: NotificationMode.auto,
);

Form Validation

CustomSnackbar.show(
  context: context,
  label: "Please fill in all required fields",
  mode: NotificationMode.auto,
);

File Operations

CustomSnackbar.show(
  context: context,
  label: "File uploaded successfully",
  mode: NotificationMode.auto,
  showProgress: true,
);

System Alerts

CustomSnackbar.show(
  context: context,
  label: "Warning: Low storage space",
  mode: NotificationMode.auto,
);

🔧 Platform Support

• ✅ Android
• ✅ iOS
• ✅ Web
• ✅ Desktop (macOS, Windows, Linux)

📄 License

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

🤝 Contributing

Contributions are welcome! Please:

1. Fork the repository
2. Create a feature branch
3. Commit your changes
4. Push to the branch
5. Open a Pull Request

Development Setup

git clone https://github.com/manar42/custom_snackbar_plus.git
cd custom_snackbar_plus
flutter pub get
flutter run  # Run example app
flutter test  # Run tests

📞 Support

If you find this package helpful, please ⭐ star the repository!

For issues and questions:

• GitHub Issues
• Pub.dev Package

---

Made with ❤️ for the Flutter community