feat: Improved ExpandListTile widget with an animation.

Skyost · Oct 28, 2024 · 2cd61bc · 2cd61bc
1 parent 9452fc7
commit 2cd61bc
Showing 1 changed file with 44 additions and 3 deletions.
diff --git a/lib/widgets/list/expand_list_tile.dart b/lib/widgets/list/expand_list_tile.dart
@@ -29,10 +29,26 @@ class ExpandListTile extends StatefulWidget {
 }
 
 /// The expand list tile instance.
-class _ExpandListTileState extends State<ExpandListTile> with BrightnessListener {
+class _ExpandListTileState extends State<ExpandListTile> with SingleTickerProviderStateMixin, BrightnessListener {
+  /// The expand controller.
+  late AnimationController expandController;
+
+  /// The expand animation.
+  late Animation<double> expandAnimation;
+
   /// Whether the content is expanded.
   bool expand = false;
 
+  @override
+  void initState() {
+    super.initState();
+    expandController = AnimationController(vsync: this, duration: Duration(milliseconds: 200));
+    expandAnimation = CurvedAnimation(
+      parent: expandController,
+      curve: Curves.fastOutSlowIn,
+    );
+  }
+
   @override
   Widget build(BuildContext context) => Column(
         mainAxisSize: MainAxisSize.min,
@@ -41,7 +57,13 @@ class _ExpandListTileState extends State<ExpandListTile> with BrightnessListener
             iconColor: Theme.of(context).colorScheme.primary,
             title: widget.title,
             onTap: () {
-              setState(() => expand = !expand);
+              bool willExpand = !expand;
+              setState(() => expand = willExpand);
+              if (willExpand) {
+                expandController.forward();
+              } else {
+                expandController.reverse();
+              }
             },
             trailing: AnimatedRotation(
               turns: expand ? 0.25 : 0,
@@ -53,7 +75,26 @@ class _ExpandListTileState extends State<ExpandListTile> with BrightnessListener
             ),
             enabled: widget.enabled,
           ),
-          if (expand) ...widget.children,
+          SizeTransition(
+            axisAlignment: 1.0,
+            sizeFactor: expandAnimation,
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              children: widget.children,
+            ),
+          ),
+          // for (Widget child in widget.children)
+          //   SizeTransition(
+          //     axisAlignment: 1.0,
+          //     sizeFactor: expandAnimation,
+          //     child: child,
+          //   ),
         ],
       );
+
+  @override
+  void dispose() {
+    expandController.dispose();
+    super.dispose();
+  }
 }