msglist: Use scale animation for mark-as-read button is pressed

Author: Khader-1

lib/widgets/message_list.dart

@@ -497,6 +497,7 @@ class MarkAsReadWidgetState extends State<MarkAsReadWidget> {
             padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10 - ((48 - 38) / 2)),
             child: FilledButton.icon(
               style: FilledButton.styleFrom(
+                splashFactory: NoSplash.splashFactory,
                 minimumSize: const Size.fromHeight(38),
                 textStyle:
                   // Restate [FilledButton]'s default, which inherits from
@@ -522,7 +523,7 @@ class MarkAsReadWidgetState extends State<MarkAsReadWidget> {
   }
 }
 
-class MarkAsReadAnimation extends StatelessWidget {
+class MarkAsReadAnimation extends StatefulWidget {
   final bool loading;
   final bool hidden;
   final Widget child;
@@ -534,13 +535,34 @@ class MarkAsReadAnimation extends StatelessWidget {
     required this.child
   });
 
+  @override
+  State<MarkAsReadAnimation> createState() => _MarkAsReadAnimationState();
+}
+
+class _MarkAsReadAnimationState extends State<MarkAsReadAnimation> {
+  bool _isPressed = false;
+
+  void _setScale(bool isPressed) {
+    setState(() {
+      _isPressed = isPressed;
+    });
+  }
+
   @override
   Widget build(BuildContext context) {
-    return AnimatedOpacity(
-      opacity: hidden ? 0 : loading ? 0.5 : 1,
-      duration: const Duration(milliseconds: 500),
-      curve: Curves.easeOut,
-      child: child);
+    return GestureDetector(
+      onTapDown: (_) => _setScale(true),
+      onTapUp: (_) => _setScale(false),
+      onTapCancel: () => _setScale(false),
+      child: AnimatedScale(
+        scale: _isPressed ? 0.95 : 1,
+        duration: const Duration(milliseconds: 100),
+        curve: Curves.easeOut,
+        child: AnimatedOpacity(
+          opacity: widget.hidden ? 0 : widget.loading ? 0.5 : 1,
+          duration: const Duration(milliseconds: 500),
+          curve: Curves.easeOut,
+          child: widget.child)));
   }
 }