explorer animations

lib/widgets/common/identity/empty.dart

@@ -1,5 +1,8 @@
+import 'package:aves/theme/durations.dart';
 import 'package:aves/widgets/common/extensions/media_query.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/scheduler.dart';
+import 'package:flutter_staggered_animations/flutter_staggered_animations.dart';
 import 'package:provider/provider.dart';
 
 class EmptyContent extends StatelessWidget {
@@ -23,6 +26,7 @@ class EmptyContent extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final color = Theme.of(context).colorScheme.primary.withOpacity(.5);
+    final durations = context.watch<DurationsData>();
     return Padding(
       padding: safeBottom
           ? EdgeInsets.only(
@@ -33,6 +37,15 @@ class EmptyContent extends StatelessWidget {
         alignment: alignment,
         child: Column(
           mainAxisSize: MainAxisSize.min,
+          children: AnimationConfiguration.toStaggeredList(
+            duration: durations.staggeredAnimation,
+            delay: durations.staggeredAnimationDelay * timeDilation,
+            childAnimationBuilder: (child) => SlideAnimation(
+              verticalOffset: 50.0,
+              child: FadeInAnimation(
+                child: child,
+              ),
+            ),
             children: [
               if (icon != null) ...[
                 Icon(
@@ -55,6 +68,7 @@ class EmptyContent extends StatelessWidget {
             ],
           ),
         ),
+      ),
     );
   }
 }

lib/widgets/explorer/explorer_page.dart

@@ -32,6 +32,7 @@ import 'package:collection/collection.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/scheduler.dart';
+import 'package:flutter_staggered_animations/flutter_staggered_animations.dart';
 import 'package:provider/provider.dart';
 
 class ExplorerPage extends StatefulWidget {
@@ -115,13 +116,25 @@ class _ExplorerPageState extends State<ExplorerPage> {
                         ),
                       );
                     }
-                      return ListView.builder(
+                    final durations = context.watch<DurationsData>();
-                        itemCount: contents.length,
+                    return AnimationLimiter(
-                        itemBuilder: (context, index) {
+                      key: ValueKey(_currentDirectoryPath),
-                          return index < contents.length ? _buildContentLine(context, contents[index]) : const SizedBox();
+                      child: ListView(
-                        },
+                        children: AnimationConfiguration.toStaggeredList(
+                          duration: durations.staggeredAnimation,
+                          delay: durations.staggeredAnimationDelay * timeDilation,
+                          childAnimationBuilder: (child) => SlideAnimation(
+                            verticalOffset: 50.0,
+                            child: FadeInAnimation(
+                              child: child,
+                            ),
+                          ),
+                          children: contents.map((v) => _buildContentLine(context, v)).toList(),
+                        ),
+                      ),
                     );
-                    }),
+                  },
+                ),
               ),
               const Divider(height: 0),
               Padding(