added content position animation when error bar is displayed

This commit is contained in:
Elias Müller 2024-04-24 19:23:32 +02:00
parent 3802e4a5b9
commit 2db3b29359

View File

@ -13,42 +13,46 @@ class ErrorBar extends StatelessWidget {
@override @override
Widget build(BuildContext context) => ControllerProvider<ErrorBarController>( Widget build(BuildContext context) => ControllerProvider<ErrorBarController>(
create: (context) => ErrorBarController(), create: (context) => ErrorBarController(),
child: (context) => AnimatedSwitcher( child: (context) => AnimatedSize(
duration: animationDuration, duration: animationDuration,
transitionBuilder: (Widget child, Animation<double> animation) => SlideTransition( child: AnimatedSwitcher(
position: Tween<Offset>( duration: animationDuration,
begin: const Offset(0.0, -1.0), transitionBuilder: (Widget child, Animation<double> animation) => SlideTransition(
end: Offset.zero, position: Tween<Offset>(
).animate(animation), begin: const Offset(0.0, -1.0),
child: child, end: Offset.zero,
), ).animate(animation),
child: Visibility( child: child,
key: Key(visible.hashCode.toString()), ),
visible: visible, child: Visibility(
child: Builder( key: Key(visible.hashCode.toString()),
builder: (context) { visible: visible,
var controller = context.watchController<ErrorBarController>(); replacement: const SizedBox(width: double.infinity),
var status = controller.connectivityStatusKnown() && !controller.isConnected() child: Builder(
? (icon: Icons.wifi_off_outlined, text: 'Offline', color: Colors.grey.shade600) builder: (context) {
: (icon: Icons.wifi_find_outlined, text: 'Verbindung fehlgeschlagen', color: Theme.of(context).primaryColor); var controller = context.watchController<ErrorBarController>();
var status = controller.connectivityStatusKnown() && !controller.isConnected()
? (icon: Icons.wifi_off_outlined, text: 'Offline', color: Colors.grey.shade600)
: (icon: Icons.wifi_find_outlined, text: 'Verbindung fehlgeschlagen', color: Theme.of(context).primaryColor);
return Container( return Container(
height: 20, height: 20,
decoration: BoxDecoration( decoration: BoxDecoration(
color: status.color, color: status.color,
), ),
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
Icon(status.icon, size: 14), Icon(status.icon, size: 14),
const SizedBox(width: 10), const SizedBox(width: 10),
Text(status.text, style: const TextStyle(fontSize: 12)) Text(status.text, style: const TextStyle(fontSize: 12))
], ],
), ),
); );
}, },
) )
) )
),
), ),
); );
} }