278 lines
9.9 KiB
Dart
278 lines
9.9 KiB
Dart
import 'package:flutter/foundation.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:fluttertoast/fluttertoast.dart';
|
|
// import 'package:fluttertoast/fluttertoast.dart';
|
|
import 'package:toastification/toastification.dart';
|
|
import 'package:universal_html/html.dart' as html;
|
|
|
|
class ToastHelper {
|
|
static void showSuccessToast(BuildContext context, String message) {
|
|
toastification.show(
|
|
context: context,
|
|
type: ToastificationType.success,
|
|
style: ToastificationStyle.flatColored,
|
|
autoCloseDuration: const Duration(seconds: 2),
|
|
title: Text(message),
|
|
// you can also use RichText widget for title and description parameters
|
|
// description: RichText(
|
|
// text: const TextSpan(text: 'This is a sample toast message. ')),
|
|
alignment: Alignment.topRight,
|
|
direction: TextDirection.ltr,
|
|
animationDuration: const Duration(milliseconds: 100),
|
|
animationBuilder: (context, animation, alignment, child) {
|
|
return FadeTransition(opacity: animation, child: child);
|
|
},
|
|
icon: const Icon(Icons.check),
|
|
primaryColor: Colors.green,
|
|
backgroundColor: Colors.white,
|
|
foregroundColor: Colors.black,
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 16),
|
|
margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
|
borderRadius: BorderRadius.circular(12),
|
|
boxShadow: const [
|
|
BoxShadow(
|
|
color: Color(0x07000000),
|
|
blurRadius: 16,
|
|
offset: Offset(0, 16),
|
|
spreadRadius: 0,
|
|
),
|
|
],
|
|
showProgressBar: true,
|
|
closeButtonShowType: CloseButtonShowType.onHover,
|
|
closeOnClick: false,
|
|
pauseOnHover: true,
|
|
dragToClose: true,
|
|
applyBlurEffect: true,
|
|
callbacks: ToastificationCallbacks(
|
|
onTap: (toastItem) => print('Toast ${toastItem.id} tapped'),
|
|
onCloseButtonTap: (toastItem) =>
|
|
print('Toast ${toastItem.id} close button tapped'),
|
|
onAutoCompleteCompleted: (toastItem) =>
|
|
print('Toast ${toastItem.id} auto complete completed'),
|
|
onDismissed: (toastItem) => print('Toast ${toastItem.id} dismissed'),
|
|
),
|
|
);
|
|
}
|
|
|
|
static void showWarningToast(BuildContext context, String message) {
|
|
toastification.show(
|
|
context: context,
|
|
type: ToastificationType.warning,
|
|
style: ToastificationStyle.flatColored,
|
|
autoCloseDuration: const Duration(seconds: 2),
|
|
title: Text(message),
|
|
// you can also use RichText widget for title and description parameters
|
|
// description: RichText(
|
|
// text: const TextSpan(text: 'This is a sample toast message. ')),
|
|
alignment: Alignment.topRight,
|
|
direction: TextDirection.ltr,
|
|
animationDuration: const Duration(milliseconds: 100),
|
|
animationBuilder: (context, animation, alignment, child) {
|
|
return FadeTransition(opacity: animation, child: child);
|
|
},
|
|
icon: const Icon(Icons.warning),
|
|
primaryColor: Colors.amberAccent,
|
|
backgroundColor: Colors.white,
|
|
foregroundColor: Colors.black,
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 16),
|
|
margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
|
borderRadius: BorderRadius.circular(12),
|
|
boxShadow: const [
|
|
BoxShadow(
|
|
color: Color(0x07000000),
|
|
blurRadius: 16,
|
|
offset: Offset(0, 16),
|
|
spreadRadius: 0,
|
|
),
|
|
],
|
|
showProgressBar: true,
|
|
closeButtonShowType: CloseButtonShowType.onHover,
|
|
closeOnClick: false,
|
|
pauseOnHover: true,
|
|
dragToClose: true,
|
|
applyBlurEffect: true,
|
|
callbacks: ToastificationCallbacks(
|
|
onTap: (toastItem) => print('Toast ${toastItem.id} tapped'),
|
|
onCloseButtonTap: (toastItem) =>
|
|
print('Toast ${toastItem.id} close button tapped'),
|
|
onAutoCompleteCompleted: (toastItem) =>
|
|
print('Toast ${toastItem.id} auto complete completed'),
|
|
onDismissed: (toastItem) => print('Toast ${toastItem.id} dismissed'),
|
|
),
|
|
);
|
|
}
|
|
|
|
static void showErrorToast(BuildContext context, String message) {
|
|
toastification.show(
|
|
context: context,
|
|
type: ToastificationType.error,
|
|
style: ToastificationStyle.flatColored,
|
|
autoCloseDuration: const Duration(seconds: 2),
|
|
title: Text(message),
|
|
// you can also use RichText widget for title and description parameters
|
|
// description: RichText(
|
|
// text: const TextSpan(text: 'This is a sample toast message. ')),
|
|
alignment: Alignment.topRight,
|
|
direction: TextDirection.ltr,
|
|
animationDuration: const Duration(milliseconds: 100),
|
|
animationBuilder: (context, animation, alignment, child) {
|
|
return FadeTransition(opacity: animation, child: child);
|
|
},
|
|
icon: const Icon(Icons.error),
|
|
primaryColor: Colors.redAccent,
|
|
backgroundColor: Colors.white,
|
|
foregroundColor: Colors.black,
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 16),
|
|
margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
|
borderRadius: BorderRadius.circular(12),
|
|
boxShadow: const [
|
|
BoxShadow(
|
|
color: Color(0x07000000),
|
|
blurRadius: 16,
|
|
offset: Offset(0, 16),
|
|
spreadRadius: 0,
|
|
),
|
|
],
|
|
showProgressBar: true,
|
|
closeButtonShowType: CloseButtonShowType.onHover,
|
|
closeOnClick: false,
|
|
pauseOnHover: true,
|
|
dragToClose: true,
|
|
applyBlurEffect: true,
|
|
callbacks: ToastificationCallbacks(
|
|
onTap: (toastItem) => print('Toast ${toastItem.id} tapped'),
|
|
onCloseButtonTap: (toastItem) =>
|
|
print('Toast ${toastItem.id} close button tapped'),
|
|
onAutoCompleteCompleted: (toastItem) =>
|
|
print('Toast ${toastItem.id} auto complete completed'),
|
|
onDismissed: (toastItem) => print('Toast ${toastItem.id} dismissed'),
|
|
),
|
|
);
|
|
// _showToast(context, message, Colors.red);
|
|
}
|
|
|
|
static void showInfoToast(BuildContext context, String message) {
|
|
toastification.show(
|
|
context: context,
|
|
type: ToastificationType.info,
|
|
style: ToastificationStyle.flatColored,
|
|
autoCloseDuration: const Duration(seconds: 2),
|
|
title: Text(message),
|
|
// you can also use RichText widget for title and description parameters
|
|
// description: RichText(
|
|
// text: const TextSpan(text: 'This is a sample toast message. ')),
|
|
alignment: Alignment.topRight,
|
|
direction: TextDirection.ltr,
|
|
animationDuration: const Duration(milliseconds: 100),
|
|
animationBuilder: (context, animation, alignment, child) {
|
|
return FadeTransition(opacity: animation, child: child);
|
|
},
|
|
icon: const Icon(Icons.info),
|
|
primaryColor: Colors.lightBlue,
|
|
backgroundColor: Colors.white,
|
|
foregroundColor: Colors.black,
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 16),
|
|
margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
|
borderRadius: BorderRadius.circular(12),
|
|
boxShadow: const [
|
|
BoxShadow(
|
|
color: Color(0x07000000),
|
|
blurRadius: 16,
|
|
offset: Offset(0, 16),
|
|
spreadRadius: 0,
|
|
),
|
|
],
|
|
showProgressBar: true,
|
|
closeButtonShowType: CloseButtonShowType.onHover,
|
|
closeOnClick: false,
|
|
pauseOnHover: true,
|
|
dragToClose: true,
|
|
applyBlurEffect: true,
|
|
callbacks: ToastificationCallbacks(
|
|
onTap: (toastItem) => print('Toast ${toastItem.id} tapped'),
|
|
onCloseButtonTap: (toastItem) =>
|
|
print('Toast ${toastItem.id} close button tapped'),
|
|
onAutoCompleteCompleted: (toastItem) =>
|
|
print('Toast ${toastItem.id} auto complete completed'),
|
|
onDismissed: (toastItem) => print('Toast ${toastItem.id} dismissed'),
|
|
),
|
|
);
|
|
// _showToast(context, message, Colors.red);
|
|
}
|
|
|
|
static void show(String message, Color backgroundColor) {
|
|
if (kIsWeb) {
|
|
_showWebToast(message, backgroundColor);
|
|
} else {
|
|
Fluttertoast.showToast(
|
|
msg: message,
|
|
toastLength: Toast.LENGTH_SHORT,
|
|
gravity: ToastGravity.BOTTOM,
|
|
backgroundColor: backgroundColor,
|
|
textColor: Colors.white,
|
|
fontSize: 16.0,
|
|
);
|
|
}
|
|
}
|
|
|
|
static void _showWebToast(String message, Color backgroundColor) {
|
|
// Create toast element
|
|
final toast = html.DivElement()
|
|
..style.position = 'fixed'
|
|
..style.top =
|
|
'20px' // Top position
|
|
..style.right =
|
|
'20px' // Left position
|
|
..style.backgroundColor = _colorToRgba(backgroundColor)
|
|
..style.color = 'white'
|
|
..style.padding = '12px 24px'
|
|
..style.borderRadius = '8px'
|
|
// ..style.borderColor = _colorToRgba(backgroundColor)
|
|
..style.boxShadow = '0 4px 6px rgba(0, 0, 0, 0.2)'
|
|
..style.zIndex = '9999'
|
|
..style.fontSize = '12px'
|
|
..style.fontFamily = "'Inter', sans-serif"
|
|
..style.fontWeight =
|
|
'800' // Bold
|
|
..style.minWidth = '200px'
|
|
..style.maxWidth = '400px'
|
|
..style.textAlign = 'left'
|
|
..style.transition = 'all 0.3s ease-in-out'
|
|
..style.opacity = '0'
|
|
..text = message;
|
|
|
|
// Add to body
|
|
html.document.body?.append(toast);
|
|
|
|
// Fade in animation
|
|
Future.delayed(Duration(milliseconds: 10), () {
|
|
toast.style.opacity = '1';
|
|
});
|
|
|
|
// Auto remove after 3 seconds
|
|
Future.delayed(Duration(milliseconds: 2700), () {
|
|
toast.style.opacity = '0';
|
|
});
|
|
|
|
Future.delayed(Duration(seconds: 3), () {
|
|
toast.remove();
|
|
});
|
|
}
|
|
|
|
static String _colorToRgba(Color color) {
|
|
return 'rgba(${color.red}, ${color.green}, ${color.blue}, ${color.opacity})';
|
|
}
|
|
|
|
// static void _showToast(BuildContext context, String message, Color color) {
|
|
// Fluttertoast.showToast(
|
|
// msg: message,
|
|
// toastLength: Toast.LENGTH_SHORT,
|
|
// gravity: ToastGravity.TOP,
|
|
// timeInSecForIosWeb: 5,
|
|
// backgroundColor: color,
|
|
// textColor: Colors.white,
|
|
// fontSize: 16.0,
|
|
// );
|
|
// }
|
|
}
|