Replace SnackBars with custom iOS-style top alerts with icons
This commit is contained in:
parent
4acfdb9c4a
commit
67142977c0
|
|
@ -1,3 +1,4 @@
|
|||
import 'dart:async';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class FadeSlidePageRoute<T> extends PageRouteBuilder<T> {
|
||||
|
|
@ -34,3 +35,154 @@ class FadeSlidePageRoute<T> extends PageRouteBuilder<T> {
|
|||
reverseTransitionDuration: const Duration(milliseconds: 200),
|
||||
);
|
||||
}
|
||||
|
||||
void showTopAlert(
|
||||
BuildContext context,
|
||||
String message, {
|
||||
bool isError = false,
|
||||
IconData? icon,
|
||||
}) {
|
||||
final overlayState = Overlay.of(context);
|
||||
late OverlayEntry overlayEntry;
|
||||
|
||||
overlayEntry = OverlayEntry(
|
||||
builder: (context) => _TopAlertWidget(
|
||||
message: message,
|
||||
isError: isError,
|
||||
icon: icon,
|
||||
onDismiss: () {
|
||||
overlayEntry.remove();
|
||||
},
|
||||
),
|
||||
);
|
||||
|
||||
overlayState.insert(overlayEntry);
|
||||
}
|
||||
|
||||
class _TopAlertWidget extends StatefulWidget {
|
||||
final String message;
|
||||
final bool isError;
|
||||
final IconData? icon;
|
||||
final VoidCallback onDismiss;
|
||||
|
||||
const _TopAlertWidget({
|
||||
required this.message,
|
||||
required this.isError,
|
||||
this.icon,
|
||||
required this.onDismiss,
|
||||
});
|
||||
|
||||
@override
|
||||
State<_TopAlertWidget> createState() => _TopAlertWidgetState();
|
||||
}
|
||||
|
||||
class _TopAlertWidgetState extends State<_TopAlertWidget> with SingleTickerProviderStateMixin {
|
||||
late AnimationController _controller;
|
||||
late Animation<double> _slideAnimation;
|
||||
late Animation<double> _opacityAnimation;
|
||||
Timer? _dismissTimer;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_controller = AnimationController(
|
||||
vsync: this,
|
||||
duration: const Duration(milliseconds: 400),
|
||||
);
|
||||
|
||||
_slideAnimation = CurvedAnimation(
|
||||
parent: _controller,
|
||||
curve: Curves.easeOutBack,
|
||||
);
|
||||
|
||||
_opacityAnimation = CurvedAnimation(
|
||||
parent: _controller,
|
||||
curve: Curves.easeIn,
|
||||
);
|
||||
|
||||
_controller.forward();
|
||||
|
||||
_dismissTimer = Timer(const Duration(milliseconds: 2800), () {
|
||||
if (mounted) {
|
||||
_controller.reverse().then((_) {
|
||||
widget.onDismiss();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_dismissTimer?.cancel();
|
||||
_controller.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final mediaQuery = MediaQuery.of(context);
|
||||
final topPadding = mediaQuery.padding.top + 16.0;
|
||||
|
||||
IconData alertIcon = widget.icon ??
|
||||
(widget.isError ? Icons.error_outline : Icons.check_circle_outline);
|
||||
Color backgroundColor = widget.isError ? const Color(0xFFBA1A20) : const Color(0xFF2E7D32);
|
||||
|
||||
return AnimatedBuilder(
|
||||
animation: _controller,
|
||||
builder: (context, child) {
|
||||
return Positioned(
|
||||
top: topPadding * _slideAnimation.value - 80.0 * (1.0 - _slideAnimation.value),
|
||||
left: 16.0,
|
||||
right: 16.0,
|
||||
child: Opacity(
|
||||
opacity: _opacityAnimation.value,
|
||||
child: Material(
|
||||
color: Colors.transparent,
|
||||
child: Align(
|
||||
alignment: Alignment.topCenter,
|
||||
child: ConstrainedBox(
|
||||
constraints: const BoxConstraints(maxWidth: 450),
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 12.0),
|
||||
decoration: BoxDecoration(
|
||||
color: backgroundColor,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.12),
|
||||
blurRadius: 16,
|
||||
offset: const Offset(0, 6),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(
|
||||
alertIcon,
|
||||
color: Colors.white,
|
||||
size: 20,
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Text(
|
||||
widget.message,
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import 'dart:math';
|
||||
import 'package:flutter/material.dart';
|
||||
import '../route_transitions.dart';
|
||||
|
||||
class ProductItem {
|
||||
final String id;
|
||||
|
|
@ -160,13 +161,7 @@ class _BillingDashboardScreenState extends State<BillingDashboardScreen> {
|
|||
}
|
||||
|
||||
void _showErrorSnackBar(String message) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(
|
||||
content: Text(message),
|
||||
backgroundColor: Colors.red[800],
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
);
|
||||
showTopAlert(context, message, isError: true);
|
||||
}
|
||||
|
||||
double get _subtotal {
|
||||
|
|
@ -944,12 +939,10 @@ class _BillingDashboardScreenState extends State<BillingDashboardScreen> {
|
|||
const SizedBox(height: 16),
|
||||
ElevatedButton.icon(
|
||||
onPressed: () {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(
|
||||
content: Text('🧾 Thermal Printed: $_invoiceNumber successfully!'),
|
||||
backgroundColor: const Color(0xFF10B981),
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Thermal Printed: $_invoiceNumber successfully!',
|
||||
icon: Icons.print,
|
||||
);
|
||||
},
|
||||
icon: const Icon(Icons.print, size: 16),
|
||||
|
|
|
|||
|
|
@ -90,29 +90,25 @@ class _BusinessSetupScreenState extends State<BusinessSetupScreen> {
|
|||
setState(() {
|
||||
_uploadedDocs[docName] = file.name;
|
||||
});
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(
|
||||
content: Text('✅ Successfully loaded $docName!'),
|
||||
backgroundColor: Colors.green,
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Successfully loaded $docName!',
|
||||
icon: Icons.check_circle_outline,
|
||||
);
|
||||
}
|
||||
} catch (e) {
|
||||
if (!mounted) return;
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(
|
||||
content: Text('Failed to pick image: $e'),
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Failed to pick image: $e',
|
||||
isError: true,
|
||||
);
|
||||
}
|
||||
} else {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('Permission denied. Cannot load document image.'),
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Permission denied. Cannot load document image.',
|
||||
isError: true,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -298,11 +294,10 @@ class _BusinessSetupScreenState extends State<BusinessSetupScreen> {
|
|||
setState(() {
|
||||
_uploadedDocs.remove(docName);
|
||||
});
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(
|
||||
content: Text('$docName attachment removed.'),
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'$docName attachment removed.',
|
||||
icon: Icons.delete_outline,
|
||||
);
|
||||
},
|
||||
),
|
||||
|
|
@ -590,12 +585,10 @@ class _BusinessSetupScreenState extends State<BusinessSetupScreen> {
|
|||
const SizedBox(width: 12),
|
||||
ElevatedButton(
|
||||
onPressed: () {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('GSTIN Verified Successfully!'),
|
||||
backgroundColor: Colors.green,
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'GSTIN Verified Successfully!',
|
||||
icon: Icons.verified_outlined,
|
||||
);
|
||||
},
|
||||
style: ElevatedButton.styleFrom(
|
||||
|
|
@ -628,12 +621,10 @@ class _BusinessSetupScreenState extends State<BusinessSetupScreen> {
|
|||
const SizedBox(height: 8),
|
||||
InkWell(
|
||||
onTap: () {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('📍 Location detected: Sector 62, Noida, UP'),
|
||||
backgroundColor: Colors.green,
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Location detected: Sector 62, Noida, UP',
|
||||
icon: Icons.my_location_outlined,
|
||||
);
|
||||
},
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
|
|
|
|||
|
|
@ -84,11 +84,10 @@ class _MobileLoginScreenState extends State<MobileLoginScreen> {
|
|||
if (status.isGranted || kIsWeb) {
|
||||
_showContactPicker();
|
||||
} else {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('Contacts permission was denied. Please enter the number manually or enable it in Settings.'),
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Contacts permission was denied. Please enter the number manually or enable it in Settings.',
|
||||
isError: true,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -402,12 +401,10 @@ class _MobileLoginScreenState extends State<MobileLoginScreen> {
|
|||
setState(() {
|
||||
_isValid = true;
|
||||
});
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('⚡ Phone verified automatically with Truecaller! Joining PozoApp...'),
|
||||
backgroundColor: Color(0xFF005FAF),
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Phone verified automatically with Truecaller! Joining PozoApp...',
|
||||
icon: Icons.verified_user_outlined,
|
||||
);
|
||||
Navigator.push(
|
||||
context,
|
||||
|
|
@ -610,11 +607,10 @@ class _MobileLoginScreenState extends State<MobileLoginScreen> {
|
|||
SizedBox(height: gap / 2),
|
||||
OutlinedButton(
|
||||
onPressed: () {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('💬 Connecting with Pozo Support... Please wait.'),
|
||||
behavior: SnackBarBehavior.floating,
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Connecting with Pozo Support... Please wait.',
|
||||
icon: Icons.support_agent_outlined,
|
||||
);
|
||||
},
|
||||
style: OutlinedButton.styleFrom(
|
||||
|
|
|
|||
|
|
@ -293,13 +293,10 @@ class SetupCompleteScreen extends StatelessWidget {
|
|||
// Primary Launcher CTA
|
||||
ElevatedButton(
|
||||
onPressed: () {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('⚡ Launching Register Dashboard... Enjoy billing!'),
|
||||
behavior: SnackBarBehavior.floating,
|
||||
backgroundColor: Colors.green,
|
||||
duration: Duration(milliseconds: 1500),
|
||||
),
|
||||
showTopAlert(
|
||||
context,
|
||||
'Launching Register Dashboard... Enjoy billing!',
|
||||
icon: Icons.rocket_launch_outlined,
|
||||
);
|
||||
Navigator.push(
|
||||
context,
|
||||
|
|
|
|||
Loading…
Reference in New Issue