π Custom Quick Alert
The most beautiful and customizable alert dialogs for Flutter Applications
Create stunning, professional-looking alerts with smooth animations, extensive customization options, and zero hassle setup.
π― Professional β’ π¨ Customizable β’ β‘ High-Performance β’ π§ Context-Free
π Table of Contents
- β¨ Features
- π― Demo
- π Quick Start
- π± API Reference
- π¨ Customization
- π‘ Real-World Examples
- π§ Advanced Usage
- π Migration Guide
- π Platform Support
- π Troubleshooting
- π€ Contributing
- π License
β¨ Features
π― Core Capabilities
π Modern Architecture
π¨ Visual Excellence
|
βοΈ Customization
π‘οΈ Enterprise Ready
|
π― Demo
π¬ Live Demonstration

Experience the full power of Custom Quick Alert in action
π± Alert Types Showcase
Success β | Error β | Warning β οΈ |
---|---|---|
![]() |
![]() |
![]() |
Info βΉοΈ | Confirm π€ | Loading β³ |
---|---|---|
![]() |
![]() |
![]() |
π¨ Dialog Previews
Success Dialog β | Error Dialog β | Warning Dialog β οΈ |
---|---|---|
![]() |
![]() |
![]() |
Info Dialog βΉοΈ | Confirm Dialog π€ | Loading Dialog β³ |
---|---|---|
![]() |
![]() |
![]() |
π Quick Start
π¦ Installation
Add to your pubspec.yaml
:
dependencies:
custom_quick_alert: ^2.1.1
Install the package:
flutter pub add custom_quick_alert
βοΈ Setup (One-Time Configuration)
π Important: Configure the global navigator key for context-free usage:
import 'package:flutter/material.dart';
import 'package:custom_quick_alert/custom_quick_alert.dart';
// 1. Create global navigator key
final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();
void main() {
runApp(const MyApp());
// 2. Initialize CustomQuickAlert
CustomQuickAlert.initialize(navigatorKey);
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
navigatorKey: navigatorKey, // 3. Assign navigator key
title: 'Custom Quick Alert Demo',
home: const HomePage(),
);
}
}
π― Basic Usage
import 'package:custom_quick_alert/custom_quick_alert.dart';
// β
Success Alert
CustomQuickAlert.success(
title: 'Success!',
message: 'Operation completed successfully.',
);
// β Error Alert
CustomQuickAlert.error(
title: 'Error Occurred',
message: 'Please try again later.',
);
// β οΈ Warning Alert
CustomQuickAlert.warning(
title: 'Warning',
message: 'Please review your input.',
);
// βΉοΈ Info Alert
CustomQuickAlert.info(
title: 'Information',
message: 'Here is some important information.',
);
// π€ Confirmation Dialog
CustomQuickAlert.confirm(
title: 'Logout Confirmation',
message: 'Are you sure you want to logout?',
confirmText: 'Yes, Logout',
cancelText: 'Cancel',
onConfirm: () {
// Logout logic
print('User logged out');
},
onCancel: () {
// Stay logged in
print('User cancelled logout');
},
);
// β³ Loading Alert
CustomQuickAlert.loading();
// Dismiss loading after some time
Future.delayed(Duration(seconds: 3), () {
CustomQuickAlert.dismiss();
CustomQuickAlert.success(
title: 'Complete!',
message: 'Your request has been processed.',
);
});
// π¨ Custom Alert
CustomQuickAlert.custom(
title: 'Welcome!',
message: 'Thank you for joining our premium membership.',
backgroundColor: Colors.deepPurple,
titleColor: Colors.white,
messageColor: Colors.white70,
confirmText: 'Get Started',
confirmBtnColor: Colors.amber,
borderRadius: 20.0,
width: 300,
customContent: Column(
children: [
Icon(Icons.star, color: Colors.amber, size: 50),
SizedBox(height: 10),
Text('Premium Features Unlocked!',
style: TextStyle(color: Colors.white)),
],
),
);
π Comprehensive Examples
π¬ Animation Types
// Scale animation (default)
CustomQuickAlert.success(
title: 'Scale Animation',
message: 'This alert scales in.',
animationType: QuickAlertAnimationType.scale,
);
// Fade animation
CustomQuickAlert.info(
title: 'Fade Animation',
message: 'This alert fades in.',
animationType: QuickAlertAnimationType.fade,
);
// Slide animations
CustomQuickAlert.warning(
title: 'Slide Animation',
message: 'This alert slides in from top.',
animationType: QuickAlertAnimationType.slideInDown,
);
// Other slide options:
// QuickAlertAnimationType.slideInUp
// QuickAlertAnimationType.slideInLeft
// QuickAlertAnimationType.slideInRight
π Position Examples
// Top position - Perfect for notifications
CustomQuickAlert.success(
title: 'Top Alert',
message: 'This alert appears at the top.',
position: QuickAlertPosition.top,
autoCloseDuration: Duration(seconds: 3),
);
// Center position (default) - Best for important dialogs
CustomQuickAlert.info(
title: 'Center Alert',
message: 'This alert appears in the center.',
position: QuickAlertPosition.center,
);
// Bottom position - Great for confirmations
CustomQuickAlert.warning(
title: 'Bottom Alert',
message: 'This alert appears at the bottom.',
position: QuickAlertPosition.bottom,
);
β° Auto-dismiss & Callbacks
// Auto-dismiss functionality
CustomQuickAlert.success(
title: 'Auto-dismiss',
message: 'This alert will close automatically in 3 seconds.',
autoCloseDuration: Duration(seconds: 3),
showConfirm: false, // Hide confirm button for auto-dismiss
);
// Callback functions
CustomQuickAlert.confirm(
title: 'Save Changes?',
message: 'You have unsaved changes. Do you want to save them?',
onConfirm: () {
print('Changes saved!');
// Save logic here
},
onCancel: () {
print('Changes discarded!');
// Discard logic here
},
);
// Advanced callbacks with navigation
CustomQuickAlert.success(
title: 'Registration Complete',
message: 'Welcome to our app! Let\'s get you started.',
onConfirm: () {
// Navigate to home screen
Navigator.of(navigatorKey.currentContext!).pushReplacementNamed('/home');
},
);
π¨ Advanced Styling
// Professional success alert with enhanced styling
CustomQuickAlert.success(
title: 'Payment Successful',
message: 'Your transaction has been processed securely.',
useGradientButtons: true,
backgroundColor: Colors.green.shade50,
titleColor: Colors.green.shade800,
messageColor: Colors.green.shade600,
confirmBtnColor: Colors.green.shade600,
borderRadius: 20.0,
width: 350,
padding: EdgeInsets.all(24),
);
// Custom styled error alert
CustomQuickAlert.error(
title: 'Connection Failed',
message: 'Please check your internet connection and try again.',
confirmBtnColor: const Color(0xFFE53E3E),
backgroundColor: const Color(0xFFFFF5F5),
titleColor: const Color(0xFFE53E3E),
messageColor: const Color(0xFF742A2A),
borderRadius: 16.0,
confirmText: 'Retry',
showCancel: true,
cancelText: 'Cancel',
);
// Dark theme custom alert
CustomQuickAlert.custom(
title: 'Dark Theme Alert',
message: 'This alert uses a dark theme design.',
backgroundColor: Color(0xFF1E1E1E),
titleColor: Colors.white,
messageColor: Colors.white70,
confirmBtnColor: Colors.blue,
confirmTextColor: Colors.white,
borderRadius: 25.0,
);
π Barrier & Interaction Control
// Dismissible by tapping outside
CustomQuickAlert.info(
title: 'Dismissible Alert',
message: 'Tap outside to dismiss this alert.',
barrierDismissible: true, // Allow tap outside to dismiss
);
// Prevent back button dismissal
CustomQuickAlert.loading(
title: 'Processing Payment...',
message: 'Please do not close the app during payment processing.',
disableBackButton: true, // Prevents back button from dismissing
);
// Custom content widget
CustomQuickAlert.custom(
title: 'Rate Our App',
customContent: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text('How would you rate your experience?'),
SizedBox(height: 20),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: List.generate(5, (index) =>
IconButton(
icon: Icon(Icons.star, color: Colors.amber),
onPressed: () {
// Handle rating
CustomQuickAlert.dismiss();
},
),
),
),
],
),
showConfirm: false,
showCancel: false,
);
π± API Reference
π― Alert Types
// Available alert types with their use cases
CustomQuickAlert.success() // β
Success notifications & confirmations
CustomQuickAlert.error() // β Error messages & exceptions
CustomQuickAlert.warning() // β οΈ Warning alerts & cautions
CustomQuickAlert.info() // βΉοΈ Information dialogs & tips
CustomQuickAlert.confirm() // π€ Confirmation dialogs & decisions
CustomQuickAlert.loading() // β³ Loading indicators & progress
CustomQuickAlert.custom() // π¨ Fully customizable alerts
β‘ Quick Methods
// π« Dismiss current alert
CustomQuickAlert.dismiss();
// π― Check if alert is showing
bool isShowing = CustomQuickAlert.isShowing();
π Core Parameters
Parameter | Type | Description | Default |
---|---|---|---|
title |
String? |
Alert title | null |
message |
String? |
Alert message | null |
useGradientButtons |
bool |
Enable gradient styling | true |
animationType |
QuickAlertAnimationType |
Entrance animation | scale |
position |
QuickAlertPosition |
Screen position | center |
autoCloseDuration |
Duration? |
Auto-dismiss timer | null |
barrierDismissible |
bool |
Tap outside to dismiss | true |
customShadows |
List<BoxShadow>? |
Custom shadow effects | null |
confirmText |
String |
Confirm button text | 'OK' |
cancelText |
String |
Cancel button text | 'Cancel' |
showCancel |
bool |
Show cancel button | false |
showConfirm |
bool |
Show confirm button | true |
π¨ Styling Parameters
Parameter | Type | Description |
---|---|---|
backgroundColor |
Color? |
Dialog background color |
titleColor |
Color? |
Title text color |
messageColor |
Color? |
Message text color |
confirmBtnColor |
Color? |
Confirm button color |
cancelBtnColor |
Color? |
Cancel button color |
confirmTextColor |
Color? |
Confirm button text color |
cancelTextColor |
Color? |
Cancel button text color |
borderRadius |
double? |
Dialog border radius |
width |
double? |
Dialog width |
padding |
EdgeInsets? |
Dialog content padding |
π¨ Customization
π Animation Types
// Scale animation (default)
CustomQuickAlert.success(
animationType: QuickAlertAnimationType.scale,
);
// Slide animations
CustomQuickAlert.info(
animationType: QuickAlertAnimationType.slideInDown,
);
CustomQuickAlert.warning(
animationType: QuickAlertAnimationType.slideInUp,
);
CustomQuickAlert.error(
animationType: QuickAlertAnimationType.slideInLeft,
);
// Fade animation
CustomQuickAlert.custom(
animationType: QuickAlertAnimationType.fade,
lottieAsset: 'assets/animations/custom.json',
);
π Position Options
// Top positioned - Perfect for notifications
CustomQuickAlert.info(
title: 'New Update Available',
message: 'Version 2.0 is ready to install.',
position: QuickAlertPosition.top,
);
// Center positioned (default) - Best for important dialogs
CustomQuickAlert.success(
title: 'Payment Successful',
message: 'Your transaction has been completed.',
position: QuickAlertPosition.center,
);
// Bottom positioned - Great for confirmations
CustomQuickAlert.warning(
title: 'Delete Item?',
message: 'This action cannot be undone.',
position: QuickAlertPosition.bottom,
showCancel: true,
);
π¨ Professional Styling
// Professional success alert with enhanced styling
CustomQuickAlert.success(
title: 'Payment Successful',
message: 'Your transaction has been processed securely.',
useGradientButtons: true,
customShadows: [
BoxShadow(
color: Colors.green.withValues(alpha: 0.2),
blurRadius: 20,
offset: const Offset(0, 10),
),
BoxShadow(
color: Colors.green.withValues(alpha: 0.1),
blurRadius: 40,
offset: const Offset(0, 20),
),
],
backgroundColor: Colors.green.shade50,
titleColor: Colors.green.shade800,
messageColor: Colors.green.shade600,
confirmBtnColor: Colors.green.shade600,
borderRadius: 16.0,
);
// Custom styled error alert
CustomQuickAlert.error(
title: 'Connection Failed',
message: 'Please check your internet connection and try again.',
confirmBtnColor: const Color(0xFFE53E3E),
backgroundColor: const Color(0xFFFFF5F5),
titleColor: const Color(0xFFE53E3E),
messageColor: const Color(0xFF742A2A),
borderRadius: 16.0,
customShadows: [
BoxShadow(
color: Colors.red.withValues(alpha: 0.1),
blurRadius: 20,
offset: const Offset(0, 8),
),
],
);
π‘ Real-World Examples
π Authentication Flow
class AuthController {
static Future<void> loginUser(String email, String password) async {
// Show loading
CustomQuickAlert.loading(
title: 'Signing In',
message: 'Authenticating your credentials...',
);
try {
// Simulate API call
await Future.delayed(Duration(seconds: 2));
CustomQuickAlert.dismiss(); // Close loading
if (email == 'user@example.com' && password == 'password') {
// Show success
CustomQuickAlert.success(
title: 'Welcome Back!',
message: 'You have been successfully signed in.',
onConfirm: () {
Navigator.pushReplacementNamed(
navigatorKey.currentContext!,
'/dashboard'
);
},
);
} else {
// Show error
CustomQuickAlert.error(
title: 'Login Failed',
message: 'Invalid email or password. Please try again.',
confirmText: 'Try Again',
);
}
} catch (e) {
CustomQuickAlert.dismiss();
CustomQuickAlert.error(
title: 'Connection Error',
message: 'Unable to connect to server. Please check your internet connection.',
confirmText: 'Retry',
showCancel: true,
onConfirm: () => loginUser(email, password), // Retry
);
}
}
}
π File Upload with Progress
class FileUploadService {
static Future<void> uploadFile() async {
// Show loading with custom message
CustomQuickAlert.loading(
title: 'Uploading File...',
message: 'Your file is being uploaded. Please don\'t close the app.',
);
try {
// Simulate file upload progress
await Future.delayed(Duration(seconds: 3));
CustomQuickAlert.dismiss();
CustomQuickAlert.success(
title: 'Upload Complete!',
message: 'Your file has been uploaded successfully.',
confirmText: 'View File',
showCancel: true,
cancelText: 'Close',
onConfirm: () {
// Navigate to file viewer
print('Opening file viewer...');
},
);
} catch (e) {
CustomQuickAlert.dismiss();
CustomQuickAlert.error(
title: 'Upload Failed',
message: 'Failed to upload file. Would you like to try again?',
confirmText: 'Retry',
showCancel: true,
cancelText: 'Cancel',
onConfirm: () => uploadFile(), // Retry upload
);
}
}
}
ποΈ Data Deletion Confirmation
class DataService {
static void confirmDelete(String itemName, VoidCallback onDelete) {
CustomQuickAlert.warning(
title: 'Delete $itemName?',
message: 'This action cannot be undone. The item will be permanently deleted.',
confirmText: 'Delete',
cancelText: 'Cancel',
showCancel: true,
confirmBtnColor: Colors.red,
onConfirm: () {
// Show loading during deletion
CustomQuickAlert.loading(
title: 'Deleting...',
message: 'Please wait while we delete the item.',
);
Future.delayed(Duration(seconds: 1), () {
CustomQuickAlert.dismiss();
// Perform deletion
onDelete();
CustomQuickAlert.success(
title: 'Deleted Successfully',
message: '$itemName has been deleted.',
autoCloseDuration: Duration(seconds: 2),
showConfirm: false,
);
});
},
);
}
}
// Usage
DataService.confirmDelete('My Document', () {
print('Document deleted from database');
});
π Network Status Handler
class NetworkStatusHandler {
static void showNetworkError() {
CustomQuickAlert.error(
title: 'No Internet Connection',
message: 'Please check your internet connection and try again.',
confirmText: 'Retry',
showCancel: true,
cancelText: 'Offline Mode',
position: QuickAlertPosition.top,
onConfirm: () {
// Retry network operation
checkConnection();
},
onCancel: () {
// Switch to offline mode
enableOfflineMode();
},
);
}
static void showConnectionRestored() {
CustomQuickAlert.success(
title: 'Connection Restored',
message: 'You\'re back online! Syncing your data...',
position: QuickAlertPosition.top,
autoCloseDuration: Duration(seconds: 3),
showConfirm: false,
);
}
static void checkConnection() {
// Network check logic
}
static void enableOfflineMode() {
// Offline mode logic
}
}
π Form Validation
class FormValidator {
static void validateAndSubmit(Map<String, dynamic> formData) {
List<String> errors = [];
if (formData['name']?.isEmpty ?? true) {
errors.add('Name is required');
}
if (formData['email']?.isEmpty ?? true) {
errors.add('Email is required');
}
if (errors.isNotEmpty) {
CustomQuickAlert.warning(
title: 'Form Validation Error',
message: 'Please fix the following errors:\n\n${errors.join('\n')}',
confirmText: 'Fix Errors',
);
return;
}
// If validation passes
CustomQuickAlert.loading(
title: 'Submitting Form...',
message: 'Please wait while we process your information.',
);
Future.delayed(Duration(seconds: 2), () {
CustomQuickAlert.dismiss();
CustomQuickAlert.success(
title: 'Form Submitted!',
message: 'Thank you! Your information has been submitted successfully.',
onConfirm: () {
Navigator.pop(navigatorKey.currentContext!);
},
);
});
}
}
// Navigate to home
Navigator.pushReplacementNamed(context, '/home');
} catch (e) {
CustomQuickAlert.dismiss(); // Close loading
// Show error
CustomQuickAlert.error(
title: 'Login Failed',
message: e.toString(),
confirmText: 'Try Again',
onConfirm: () => _showLoginDialog(),
);
}
}
static void logout() {
CustomQuickAlert.confirm(
title: 'Sign Out',
message: 'Are you sure you want to sign out?',
confirmText: 'Sign Out',
cancelText: 'Cancel',
showCancel: true,
onConfirm: () async {
await AuthService.logout();
CustomQuickAlert.success(
title: 'Signed Out',
message: 'You have been successfully signed out.',
);
},
);
}
}
π E-commerce Actions
class ShoppingController {
static void addToCart(Product product) {
CustomQuickAlert.confirm(
title: 'Add to Cart',
message: 'Add ${product.name} to your shopping cart?',
confirmText: 'Add to Cart',
cancelText: 'Cancel',
showCancel: true,
position: QuickAlertPosition.bottom,
onConfirm: () {
CartService.addItem(product);
CustomQuickAlert.success(
title: 'Added to Cart',
message: '${product.name} has been added to your cart.',
autoCloseDuration: const Duration(seconds: 2),
);
},
);
}
static void removeFromCart(CartItem item) {
CustomQuickAlert.warning(
title: 'Remove Item',
message: 'Remove ${item.product.name} from cart?',
confirmText: 'Remove',
cancelText: 'Keep',
showCancel: true,
onConfirm: () {
CartService.removeItem(item.id);
CustomQuickAlert.info(
title: 'Item Removed',
message: 'Item has been removed from your cart.',
);
},
);
}
static Future<void> processPayment(double amount) async {
CustomQuickAlert.loading(
title: 'Processing Payment',
message: 'Please wait while we process your payment...',
);
try {
await PaymentService.charge(amount);
CustomQuickAlert.dismiss();
CustomQuickAlert.success(
title: 'Payment Successful!',
message: 'Your order has been confirmed and will be shipped soon.',
confirmText: 'View Order',
onConfirm: () => Navigator.pushNamed(context, '/orders'),
);
} catch (e) {
CustomQuickAlert.dismiss();
CustomQuickAlert.error(
title: 'Payment Failed',
message: 'Unable to process payment. Please try again.',
confirmText: 'Retry',
onConfirm: () => processPayment(amount),
);
}
}
}
π± App Updates & Maintenance
class AppUpdateController {
static Future<void> checkForUpdates() async {
CustomQuickAlert.loading(
title: 'Checking for Updates',
message: 'Looking for new version...',
);
final updateInfo = await UpdateService.checkForUpdates();
CustomQuickAlert.dismiss();
if (updateInfo.hasUpdate) {
CustomQuickAlert.info(
title: 'Update Available',
message: 'Version ${updateInfo.version} is available with new features and improvements.',
confirmText: 'Update Now',
cancelText: 'Later',
showCancel: true,
onConfirm: () => _downloadUpdate(updateInfo),
);
} else {
CustomQuickAlert.success(
title: 'Up to Date',
message: 'You are using the latest version of the app.',
autoCloseDuration: const Duration(seconds: 2),
);
}
}
static Future<void> _downloadUpdate(UpdateInfo info) async {
CustomQuickAlert.loading(
title: 'Downloading Update',
message: 'Downloading version ${info.version}...',
);
try {
await UpdateService.downloadAndInstall(info);
CustomQuickAlert.dismiss();
CustomQuickAlert.success(
title: 'Update Complete',
message: 'App will restart to apply the update.',
confirmText: 'Restart',
onConfirm: () => UpdateService.restartApp(),
);
} catch (e) {
CustomQuickAlert.dismiss();
CustomQuickAlert.error(
title: 'Update Failed',
message: 'Failed to download update. Please try again.',
confirmText: 'Retry',
onConfirm: () => _downloadUpdate(info),
);
}
}
}
π§ Advanced Usage
π¨ Custom Theme System
// Create reusable theme configurations
class AppAlerts {
// Success theme
static void showSuccess(String title, String message) {
CustomQuickAlert.success(
title: title,
message: message,
backgroundColor: const Color(0xFFF0FDF4),
titleColor: const Color(0xFF16A34A),
messageColor: const Color(0xFF166534),
confirmBtnColor: const Color(0xFF22C55E),
customShadows: [
BoxShadow(
color: Colors.green.withValues(alpha: 0.1),
blurRadius: 20,
offset: const Offset(0, 8),
),
],
);
}
// Error theme
static void showError(String title, String message) {
CustomQuickAlert.error(
title: title,
message: message,
backgroundColor: const Color(0xFFFEF2F2),
titleColor: const Color(0xFFDC2626),
messageColor: const Color(0xFF991B1B),
confirmBtnColor: const Color(0xFFEF4444),
customShadows: [
BoxShadow(
color: Colors.red.withValues(alpha: 0.1),
blurRadius: 20,
offset: const Offset(0, 8),
),
],
);
}
// Dark theme variant
static void showDarkThemeAlert(String title, String message) {
CustomQuickAlert.info(
title: title,
message: message,
backgroundColor: const Color(0xFF1F2937),
titleColor: const Color(0xFFF9FAFB),
messageColor: const Color(0xFFD1D5DB),
confirmBtnColor: const Color(0xFF3B82F6),
confirmTextColor: Colors.white,
borderRadius: 12.0,
);
}
}
π― Custom Lottie Animations
// Using custom Lottie animations
CustomQuickAlert.custom(
title: 'Custom Animation',
message: 'This alert uses a custom Lottie animation.',
lottieAsset: 'assets/animations/my_custom_animation.json',
confirmText: 'Awesome!',
backgroundColor: Colors.purple.shade50,
titleColor: Colors.purple.shade800,
confirmBtnColor: Colors.purple.shade600,
);
// Custom animation with callbacks
CustomQuickAlert.custom(
title: 'Achievement Unlocked!',
message: 'You have completed all tasks.',
lottieAsset: 'assets/animations/achievement.json',
confirmText: 'Collect Reward',
onConfirm: () {
// Handle reward collection
RewardService.collectReward();
},
);
β‘ Performance Optimization
class AlertManager {
static Timer? _debounceTimer;
static final Queue<AlertConfig> _alertQueue = Queue<AlertConfig>();
static bool _isShowingAlert = false;
// Debounced alerts to prevent spam
static void showDebouncedSuccess(String title, String message) {
_debounceTimer?.cancel();
_debounceTimer = Timer(const Duration(milliseconds: 300), () {
CustomQuickAlert.success(title: title, message: message);
});
}
// Queue management for multiple alerts
static void queueAlert(AlertConfig config) {
_alertQueue.add(config);
_processQueue();
}
static void _processQueue() {
if (_isShowingAlert || _alertQueue.isEmpty) return;
_isShowingAlert = true;
final config = _alertQueue.removeFirst();
// Show alert and process next after completion
config.show().then((_) {
_isShowingAlert = false;
_processQueue();
});
}
// Memory cleanup
static void dispose() {
_debounceTimer?.cancel();
_alertQueue.clear();
_isShowingAlert = false;
}
}
class AlertConfig {
final String title;
final String message;
final QuickAlertType type;
AlertConfig({required this.title, required this.message, required this.type});
Future<void> show() async {
switch (type) {
case QuickAlertType.success:
return CustomQuickAlert.success(title: title, message: message);
case QuickAlertType.error:
return CustomQuickAlert.error(title: title, message: message);
// ... other types
}
}
}
π Migration Guide
π Upgrading from v1.x to v2.x
π Complete Migration Guide
π¨ Breaking Changes
Version 2.0 introduces a context-free API that eliminates the need for BuildContext
.
π Migration Steps
1. Update Dependencies
dependencies:
custom_quick_alert: ^2.1.1 # Update version
2. Setup Navigator Key
// Add to main.dart
final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();
void main() {
runApp(const MyApp());
CustomQuickAlert.initialize(navigatorKey);
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
navigatorKey: navigatorKey, // Add this
home: const HomePage(),
);
}
}
3. Update API Calls
Old API (v1.x) | New API (v2.x) |
---|---|
QuickAlert.show(context: context, type: QuickAlertType.success) |
CustomQuickAlert.success() |
QuickAlert.show(context: context, type: QuickAlertType.error) |
CustomQuickAlert.error() |
QuickAlert.show(context: context, type: QuickAlertType.warning) |
CustomQuickAlert.warning() |
Before (v1.x):
QuickAlert.show(
context: context,
type: QuickAlertType.success,
title: 'Success!',
text: 'Operation completed',
);
After (v2.x):
CustomQuickAlert.success(
title: 'Success!',
message: 'Operation completed',
);
π§ Parameter Changes
v1.x Parameter | v2.x Parameter | Notes |
---|---|---|
text |
message |
Renamed for clarity |
context |
(removed) | No longer needed |
showAnimationContainer |
(removed) | Simplified animation system |
π Platform Support
Platform | Status | Version | Notes |
---|---|---|---|
π€ Android | β Stable | API 21+ | Full feature support |
π iOS | β Stable | iOS 12+ | Full feature support |
π Web | β Stable | Modern browsers | All features supported |
π₯οΈ macOS | β Stable | macOS 10.14+ | Desktop optimized |
π§ Linux | β Stable | GTK 3.0+ | Desktop optimized |
πͺ Windows | β Stable | Windows 10+ | Desktop optimized |
π Troubleshooting
π Common Issues & Solutions
Issue: Alert not showing
Cause: Navigator key not configured
Solution:
MaterialApp(
navigatorKey: navigatorKey, // Ensure this is set
// ... other properties
)
Issue: Animations not working
Cause: Missing Lottie assets
Solution:
flutter:
assets:
- assets/animations/
Issue: Custom colors not applying
Cause: Incorrect parameter usage
Solution:
CustomQuickAlert.success(
backgroundColor: Colors.green.shade50, // Dialog background
titleColor: Colors.green.shade800, // Title color
messageColor: Colors.green.shade600, // Message color
);
Issue: Memory leaks with loading alerts
Cause: Not dismissing loading alerts
Solution:
// Always dismiss loading alerts
CustomQuickAlert.loading(title: 'Loading...');
// ... async operation
CustomQuickAlert.dismiss(); // Important!
Issue: Multiple alerts showing at once
Cause: Rapid consecutive calls
Solution:
// Use debouncing or queue management
AlertManager.showDebouncedSuccess('Title', 'Message');
π Performance Metrics
β‘ Benchmarks
Metric | Value | Description |
---|---|---|
Cold Start | < 50ms | Initialization time |
Alert Display | < 100ms | Time to show alert |
Memory Usage | < 2MB | Additional RAM usage |
Animation FPS | 60 FPS | Smooth animations |
Bundle Size | +150KB | Package size impact |
Test Coverage | 100% | Complete test coverage |
π€ Contributing
We welcome contributions! Here's how you can help:
π Bug Reports
- Check existing issues
- Use the bug report template
- Include reproduction steps and system info
β¨ Feature Requests
- Search existing requests
- Use the feature request template
- Explain the use case and benefits
π§ Development Setup
# Clone repository
git clone https://github.com/ariyanshiputech/custom_quick_alert.git
cd custom_quick_alert
# Install dependencies
flutter pub get
# Run tests
flutter test
# Run example app
cd example
flutter run
π Pull Request Process
- Fork the repository
- Create feature branch (
git checkout -b feature/amazing-feature
) - Follow coding standards
- Add tests for new features
- Update documentation
- Commit changes (
git commit -m 'Add amazing feature'
) - Push to branch (
git push origin feature/amazing-feature
) - Open a Pull Request
π Roadmap
π― Upcoming Features
π Long-term Goals
π License
Custom Quick Alert is released under the MIT License.
MIT License
Copyright (c) 2024 Ariyan Shipu Technology
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
π Support & Sponsorship
π Documentation & Resources
π Resource | π Link | π Description |
---|---|---|
π Documentation Wiki | GitHub Wiki | Complete guides and tutorials |
π¦ Package | pub.flutter-io.cn | Official Dart package |
π― Example App | Demo | Working implementation |
π Issues | GitHub Issues | Bug reports and features |
π¬ Discussions | GitHub Discussions | Community Q&A |
π Changelog | CHANGELOG.md | Version history |
π Security | Security Policy | Security guidelines |