ace_toast 0.0.1
ace_toast: ^0.0.1 copied to clipboard
A simple and customizable Flutter toast notification package. Ace Toast makes it easy to display beautiful in-app messages, alerts, and notifications with flexible styling, positioning, and animations.
Modern Flutter Notification System #
A highly customizable, animated notification system for Flutter applications with support for success, error, warning, and info messages.
![Notification Types Preview]
Features #
- 🎯 4 notification types: Success, Error, Warning, Info
- 🎨 Fully customizable appearance
- ✨ Smooth animations with slide and fade effects
- 🔄 Linear progress indicator (optional)
- 👆 Multiple dismiss actions:
- Swipe to dismiss
- Tap to dismiss
- Auto-dismiss with timer
- 📱 Safe area aware
- 🎯 Singleton pattern to prevent notification overlap
- 🔍 Debug mode support
Installation #
Add this to your package's pubspec.yaml file:
dependencies:
ace_toast:
git:
url: https://github.com/lordace-coder/ace_toast.git
Then run:
flutter pub get
Basic Usage #
1. Initialize the Service #
Initialize the notification service in your main app widget:
@override
void initState() {
super.initState();
NotificationService.initialize(context);
}
2. Show Notifications #
// Success message
NotificationService.showSuccess(
'Successfully saved!',
duration: Duration(seconds: 3),
);
// Error message
NotificationService.showError(
'Something went wrong!',
duration: Duration(seconds: 3),
);
// Warning message
NotificationService.showWarning(
'Low storage space',
duration: Duration(seconds: 3),
);
// Info message
NotificationService.showInfo(
'New update available',
duration: Duration(seconds: 3),
);
Advanced Usage #
Custom Configuration #
You can customize the notification appearance using NotificationConfig:
NotificationService.showSuccess(
'Custom styled notification',
config: NotificationConfig(
backgroundColor: Colors.green.shade50,
borderColor: Colors.green.shade200,
textColor: Colors.green.shade900,
iconColor: Colors.green.shade700,
showProgressIndicator: true,
borderRadius: 12.0,
padding: EdgeInsets.all(16),
position: NotificationPosition.top,
animationDuration: Duration(milliseconds: 300),
dismissDirection: DismissDirection.up,
elevation: 2.0,
),
);
Global Configuration #
Set default configuration for all notifications:
NotificationService.setGlobalConfig(
NotificationConfig(
showProgressIndicator: true,
position: NotificationPosition.bottom,
animationDuration: Duration(milliseconds: 400),
),
);
Custom Notification Builder #
Create completely custom notifications using builder:
NotificationService.show(
builder: (context, animation) => YourCustomWidget(
animation: animation,
// ... your custom properties
),
duration: Duration(seconds: 3),
);
Configuration Options #
NotificationConfig Properties #
| Property | Type | Description |
|---|---|---|
| backgroundColor | Color? | Background color of notification |
| borderColor | Color? | Border color of notification |
| textColor | Color? | Text color of notification |
| iconColor | Color? | Icon color of notification |
| showProgressIndicator | bool | Show/hide progress indicator |
| borderRadius | double | Corner radius of notification |
| padding | EdgeInsets | Internal padding of notification |
| position | NotificationPosition | Top or bottom position |
| animationDuration | Duration | Duration of show/hide animations |
| dismissDirection | DismissDirection | Swipe direction to dismiss |
| elevation | double | Shadow elevation of notification |
| icon | IconData? | Custom icon for notification |
| progressIndicatorColor | Color? | Color of progress indicator |
| progressIndicatorHeight | double | Height of progress indicator |
| maxWidth | double? | Maximum width of notification |
| margin | EdgeInsets? | External margin of notification |
NotificationPosition Options #
NotificationPosition.topNotificationPosition.bottom
DismissDirection Options #
DismissDirection.upDismissDirection.downDismissDirection.horizontal
Example Scenarios #
Long Message Handling #
NotificationService.showInfo(
'This is a very long notification message that will wrap to multiple lines automatically while maintaining proper layout and spacing.',
duration: Duration(seconds: 5),
);
Custom Success with Progress #
NotificationService.showSuccess(
'Upload completed!',
config: NotificationConfig(
showProgressIndicator: true,
progressIndicatorColor: Colors.green.shade300,
progressIndicatorHeight: 2,
),
);
Warning with Custom Position #
NotificationService.showWarning(
'Battery low',
config: NotificationConfig(
position: NotificationPosition.bottom,
margin: EdgeInsets.only(bottom: 20),
),
);
Debug Mode #
Enable debug mode to see helpful logs:
NotificationService.debugMode = true;
Best Practices #
- Initialize the service early in your app lifecycle
- Use appropriate notification types for different scenarios
- Keep messages concise and clear
- Consider user interaction patterns when setting position
- Use consistent styling across your app
- Handle orientation changes appropriately
Notes #
- Only one notification is shown at a time
- New notifications replace existing ones
- Notifications respect safe areas on all devices
- All customization options are optional with sensible defaults
Contributing #
Feel free to contribute to this project by:
- Reporting bugs
- Suggesting new features
- Creating pull requests
License #
This notification system is open-source and available under the MIT License.