explorer animations
This commit is contained in:
parent
218846117c
commit
01dd1c925a
2 changed files with 70 additions and 43 deletions
|
@ -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!,
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|
|
@ -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(
|
||||||
|
|
Loading…
Reference in a new issue