💫 Optimize the overlay animation of notifications

This commit is contained in:
2026-01-15 01:39:48 +08:00
parent 4f569fbefd
commit 491252bba9

View File

@@ -79,15 +79,10 @@ class AnimatedNotificationItem extends HookConsumerWidget {
final isDismissed = useState(false); final isDismissed = useState(false);
final slideTween = Tween<Offset>( final slideTween = Tween<Offset>(
begin: Offset(isDesktop ? 1.0 : 0.0, 0), begin: isDesktop ? Offset(1.0, 0.0) : Offset(0.0, -1.0),
end: Offset.zero, end: Offset.zero,
).chain(CurveTween(curve: Curves.easeOutCubic)); ).chain(CurveTween(curve: Curves.easeOutCubic));
final fadeTween = Tween<double>(
begin: 0.0,
end: 1.0,
).chain(CurveTween(curve: Curves.easeOut));
useEffect(() { useEffect(() {
animationController.forward(); animationController.forward();
return null; return null;
@@ -105,17 +100,8 @@ class AnimatedNotificationItem extends HookConsumerWidget {
return () => timer.cancel(); return () => timer.cancel();
}, [item.duration, isDismissed.value]); }, [item.duration, isDismissed.value]);
return AnimatedBuilder( return SlideTransition(
animation: animationController, position: slideTween.animate(animationController),
builder: (context, child) {
return Transform.translate(
offset: slideTween.evaluate(animationController),
child: Opacity(
opacity: fadeTween.evaluate(animationController),
child: child,
),
);
},
child: Padding( child: Padding(
padding: isDesktop padding: isDesktop
? const EdgeInsets.only(bottom: 12, right: 16) ? const EdgeInsets.only(bottom: 12, right: 16)
@@ -124,7 +110,7 @@ class AnimatedNotificationItem extends HookConsumerWidget {
item: item, item: item,
isDesktop: isDesktop, isDesktop: isDesktop,
onDismiss: () {}, onDismiss: () {},
).width(isDesktop ? 340 : MediaQuery.sizeOf(context).width - 40), ).width(isDesktop ? 420 : MediaQuery.sizeOf(context).width - 40),
), ),
); );
} }