explorer animations

This commit is contained in:
Thibault Deckers 2024-06-24 22:36:31 +02:00
parent 218846117c
commit 01dd1c925a
2 changed files with 70 additions and 43 deletions

View file

@ -1,5 +1,8 @@
import 'package:aves/theme/durations.dart';
import 'package:aves/widgets/common/extensions/media_query.dart'; import 'package:aves/widgets/common/extensions/media_query.dart';
import 'package:flutter/material.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'; import 'package:provider/provider.dart';
class EmptyContent extends StatelessWidget { class EmptyContent extends StatelessWidget {
@ -23,6 +26,7 @@ class EmptyContent extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final color = Theme.of(context).colorScheme.primary.withOpacity(.5); final color = Theme.of(context).colorScheme.primary.withOpacity(.5);
final durations = context.watch<DurationsData>();
return Padding( return Padding(
padding: safeBottom padding: safeBottom
? EdgeInsets.only( ? EdgeInsets.only(
@ -33,26 +37,36 @@ class EmptyContent extends StatelessWidget {
alignment: alignment, alignment: alignment,
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: AnimationConfiguration.toStaggeredList(
if (icon != null) ...[ duration: durations.staggeredAnimation,
Icon( delay: durations.staggeredAnimationDelay * timeDilation,
icon, childAnimationBuilder: (child) => SlideAnimation(
size: 64, verticalOffset: 50.0,
color: color, child: FadeInAnimation(
child: child,
), ),
const SizedBox(height: 16) ),
], children: [
if (text.isNotEmpty) if (icon != null) ...[
Text( Icon(
text, icon,
style: TextStyle( size: 64,
color: color, color: color,
fontSize: fontSize,
), ),
textAlign: TextAlign.center, const SizedBox(height: 16)
), ],
if (bottom != null) bottom!, if (text.isNotEmpty)
], Text(
text,
style: TextStyle(
color: color,
fontSize: fontSize,
),
textAlign: TextAlign.center,
),
if (bottom != null) bottom!,
],
),
), ),
), ),
); );

View file

@ -32,6 +32,7 @@ import 'package:collection/collection.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart'; import 'package:flutter/scheduler.dart';
import 'package:flutter_staggered_animations/flutter_staggered_animations.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
class ExplorerPage extends StatefulWidget { class ExplorerPage extends StatefulWidget {
@ -95,33 +96,45 @@ class _ExplorerPageState extends State<ExplorerPage> {
children: [ children: [
Expanded( Expanded(
child: ValueListenableBuilder<List<Directory>>( child: ValueListenableBuilder<List<Directory>>(
valueListenable: _contents, valueListenable: _contents,
builder: (context, contents, child) { builder: (context, contents, child) {
if (contents.isEmpty) { if (contents.isEmpty) {
final source = context.read<CollectionSource>(); final source = context.read<CollectionSource>();
final album = _getAlbumPath(source, Directory(_currentDirectoryPath)); final album = _getAlbumPath(source, Directory(_currentDirectoryPath));
return Center( return Center(
child: EmptyContent( child: EmptyContent(
icon: AIcons.folder, icon: AIcons.folder,
text: '', text: '',
bottom: album != null bottom: album != null
? AvesFilterChip( ? AvesFilterChip(
filter: AlbumFilter(album, source.getAlbumDisplayName(context, album)), filter: AlbumFilter(album, source.getAlbumDisplayName(context, album)),
maxWidth: double.infinity, maxWidth: double.infinity,
onTap: (filter) => _goToCollectionPage(context, filter), onTap: (filter) => _goToCollectionPage(context, filter),
onLongPress: null, onLongPress: null,
) )
: null, : null,
), ),
);
}
return ListView.builder(
itemCount: contents.length,
itemBuilder: (context, index) {
return index < contents.length ? _buildContentLine(context, contents[index]) : const SizedBox();
},
); );
}), }
final durations = context.watch<DurationsData>();
return AnimationLimiter(
key: ValueKey(_currentDirectoryPath),
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), const Divider(height: 0),
Padding( Padding(