info: restored metadata section code, and fixed animation limiter scope

This commit is contained in:
Thibault Deckers 2020-10-30 12:41:53 +09:00
parent f1a26d14ab
commit 924e98f428
3 changed files with 126 additions and 130 deletions

View file

@ -1,9 +1,6 @@
import 'dart:collection';
import 'package:aves/model/filters/filters.dart'; import 'package:aves/model/filters/filters.dart';
import 'package:aves/model/image_entry.dart'; import 'package:aves/model/image_entry.dart';
import 'package:aves/model/source/collection_lens.dart'; import 'package:aves/model/source/collection_lens.dart';
import 'package:aves/services/metadata_service.dart';
import 'package:aves/utils/durations.dart'; import 'package:aves/utils/durations.dart';
import 'package:aves/widgets/common/data_providers/media_query_data_provider.dart'; import 'package:aves/widgets/common/data_providers/media_query_data_provider.dart';
import 'package:aves/widgets/common/icons.dart'; import 'package:aves/widgets/common/icons.dart';
@ -11,9 +8,7 @@ import 'package:aves/widgets/fullscreen/info/basic_section.dart';
import 'package:aves/widgets/fullscreen/info/location_section.dart'; import 'package:aves/widgets/fullscreen/info/location_section.dart';
import 'package:aves/widgets/fullscreen/info/metadata_section.dart'; import 'package:aves/widgets/fullscreen/info/metadata_section.dart';
import 'package:aves/widgets/fullscreen/info/notifications.dart'; import 'package:aves/widgets/fullscreen/info/notifications.dart';
import 'package:collection/collection.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_staggered_animations/flutter_staggered_animations.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:tuple/tuple.dart'; import 'package:tuple/tuple.dart';
@ -146,48 +141,12 @@ class _InfoPageContent extends StatefulWidget {
} }
class _InfoPageContentState extends State<_InfoPageContent> { class _InfoPageContentState extends State<_InfoPageContent> {
List<MetadataDirectory> _metadata = [];
String _loadedMetadataUri;
static const horizontalPadding = EdgeInsets.symmetric(horizontal: 8); static const horizontalPadding = EdgeInsets.symmetric(horizontal: 8);
CollectionLens get collection => widget.collection; CollectionLens get collection => widget.collection;
ImageEntry get entry => widget.entry; ImageEntry get entry => widget.entry;
bool get isVisible => widget.visibleNotifier.value;
@override
void initState() {
super.initState();
_registerWidget(widget);
_getMetadata();
}
@override
void didUpdateWidget(_InfoPageContent oldWidget) {
super.didUpdateWidget(oldWidget);
_unregisterWidget(oldWidget);
_registerWidget(widget);
_getMetadata();
}
@override
void dispose() {
_unregisterWidget(widget);
super.dispose();
}
void _registerWidget(_InfoPageContent widget) {
widget.visibleNotifier.addListener(_getMetadata);
widget.entry.metadataChangeNotifier.addListener(_onMetadataChanged);
}
void _unregisterWidget(_InfoPageContent widget) {
widget.visibleNotifier.removeListener(_getMetadata);
widget.entry.metadataChangeNotifier.removeListener(_onMetadataChanged);
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final locationAtTop = widget.split && entry.hasGps; final locationAtTop = widget.split && entry.hasGps;
@ -219,27 +178,22 @@ class _InfoPageContentState extends State<_InfoPageContent> {
); );
final metadataSliver = MetadataSectionSliver( final metadataSliver = MetadataSectionSliver(
entry: entry, entry: entry,
metadata: _metadata, visibleNotifier: widget.visibleNotifier,
); );
return AnimationLimiter( return CustomScrollView(
// we update the limiter key after fetching the metadata of a new entry, controller: widget.scrollController,
// in order to restart the staggered animation of the metadata section slivers: [
key: Key(_loadedMetadataUri), widget.appBar,
child: CustomScrollView( SliverPadding(
controller: widget.scrollController, padding: horizontalPadding + EdgeInsets.only(top: 8),
slivers: [ sliver: basicAndLocationSliver,
widget.appBar, ),
SliverPadding( SliverPadding(
padding: horizontalPadding + EdgeInsets.only(top: 8), padding: horizontalPadding + EdgeInsets.only(bottom: 8 + widget.mqViewInsetsBottom),
sliver: basicAndLocationSliver, sliver: metadataSliver,
), ),
SliverPadding( ],
padding: horizontalPadding + EdgeInsets.only(bottom: 8 + widget.mqViewInsetsBottom),
sliver: metadataSliver,
),
],
),
); );
} }
@ -247,38 +201,4 @@ class _InfoPageContentState extends State<_InfoPageContent> {
if (collection == null) return; if (collection == null) return;
FilterNotification(filter).dispatch(context); FilterNotification(filter).dispatch(context);
} }
void _onMetadataChanged() {
_metadata = [];
_loadedMetadataUri = null;
_getMetadata();
}
// fetch and hold metadata in the page widget and not in the section sliver,
// so that we can refresh and limit the staggered animation of the metadata section
Future<void> _getMetadata() async {
if (entry == null) return;
if (_loadedMetadataUri == entry.uri) return;
if (isVisible) {
final rawMetadata = await MetadataService.getAllMetadata(entry) ?? {};
_metadata = rawMetadata.entries.map((dirKV) {
final directoryName = dirKV.key as String ?? '';
final rawTags = dirKV.value as Map ?? {};
final tags = SplayTreeMap.of(Map.fromEntries(rawTags.entries.map((tagKV) {
final value = tagKV.value as String ?? '';
if (value.isEmpty) return null;
final tagName = tagKV.key as String ?? '';
return MapEntry(tagName, value);
}).where((kv) => kv != null)));
return MetadataDirectory(directoryName, tags);
}).toList()
..sort((a, b) => compareAsciiUpperCase(a.name, b.name));
_loadedMetadataUri = entry.uri;
} else {
_metadata = [];
_loadedMetadataUri = null;
}
// _expandedDirectoryNotifier.value = null;
if (mounted) setState(() {});
}
} }

View file

@ -1,82 +1,127 @@
import 'dart:collection'; import 'dart:collection';
import 'package:aves/model/image_entry.dart'; import 'package:aves/model/image_entry.dart';
import 'package:aves/services/metadata_service.dart';
import 'package:aves/utils/constants.dart'; import 'package:aves/utils/constants.dart';
import 'package:aves/utils/durations.dart'; import 'package:aves/utils/durations.dart';
import 'package:aves/widgets/common/aves_expansion_tile.dart'; import 'package:aves/widgets/common/aves_expansion_tile.dart';
import 'package:aves/widgets/common/icons.dart'; import 'package:aves/widgets/common/icons.dart';
import 'package:aves/widgets/fullscreen/info/common.dart'; import 'package:aves/widgets/fullscreen/info/common.dart';
import 'package:aves/widgets/fullscreen/info/metadata_thumbnail.dart'; import 'package:aves/widgets/fullscreen/info/metadata_thumbnail.dart';
import 'package:collection/collection.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_staggered_animations/flutter_staggered_animations.dart'; import 'package:flutter_staggered_animations/flutter_staggered_animations.dart';
class MetadataSectionSliver extends StatefulWidget { class MetadataSectionSliver extends StatefulWidget {
final ImageEntry entry; final ImageEntry entry;
final List<MetadataDirectory> metadata; final ValueNotifier<bool> visibleNotifier;
const MetadataSectionSliver({ const MetadataSectionSliver({
@required this.entry, @required this.entry,
@required this.metadata, @required this.visibleNotifier,
}); });
@override @override
State<StatefulWidget> createState() => metadataSectionSliverState(); State<StatefulWidget> createState() => _MetadataSectionSliverState();
} }
class metadataSectionSliverState extends State<MetadataSectionSliver> with AutomaticKeepAliveClientMixin { class _MetadataSectionSliverState extends State<MetadataSectionSliver> with AutomaticKeepAliveClientMixin {
List<_MetadataDirectory> _metadata = [];
final ValueNotifier<String> _loadedMetadataUri = ValueNotifier(null);
final ValueNotifier<String> _expandedDirectoryNotifier = ValueNotifier(null); final ValueNotifier<String> _expandedDirectoryNotifier = ValueNotifier(null);
ImageEntry get entry => widget.entry; ImageEntry get entry => widget.entry;
List<MetadataDirectory> get metadata => widget.metadata; bool get isVisible => widget.visibleNotifier.value;
// special directory names // special directory names
static const exifThumbnailDirectory = 'Exif Thumbnail'; // from metadata-extractor static const exifThumbnailDirectory = 'Exif Thumbnail'; // from metadata-extractor
static const xmpDirectory = 'XMP'; // from metadata-extractor static const xmpDirectory = 'XMP'; // from metadata-extractor
static const mediaDirectory = 'Media'; // additional media (video/audio/images) directory static const mediaDirectory = 'Media'; // additional media (video/audio/images) directory
@override
void initState() {
super.initState();
_registerWidget(widget);
_getMetadata();
}
@override
void didUpdateWidget(MetadataSectionSliver oldWidget) {
super.didUpdateWidget(oldWidget);
_unregisterWidget(oldWidget);
_registerWidget(widget);
_getMetadata();
}
@override
void dispose() {
_unregisterWidget(widget);
super.dispose();
}
void _registerWidget(MetadataSectionSliver widget) {
widget.visibleNotifier.addListener(_getMetadata);
widget.entry.metadataChangeNotifier.addListener(_onMetadataChanged);
}
void _unregisterWidget(MetadataSectionSliver widget) {
widget.visibleNotifier.removeListener(_getMetadata);
widget.entry.metadataChangeNotifier.removeListener(_onMetadataChanged);
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
super.build(context); super.build(context);
// use a `Column` inside a `SliverToBoxAdapter`, instead of a `SliverList`,
if (metadata.isEmpty) return SliverToBoxAdapter(child: SizedBox.shrink()); // so that we can have the metadata-dependent `AnimationLimiter` inside the metadata section
// warning: placing the `AnimationLimiter` as a parent to the `ScrollView`
final directoriesWithoutTitle = metadata.where((dir) => dir.name.isEmpty).toList(); // triggers dispose & reinitialization of other sections, including heavy widgets like maps
final directoriesWithTitle = metadata.where((dir) => dir.name.isNotEmpty).toList(); return SliverToBoxAdapter(
final untitledDirectoryCount = directoriesWithoutTitle.length; child: AnimatedBuilder(
return SliverList( animation: _loadedMetadataUri,
delegate: SliverChildBuilderDelegate( builder: (context, child) {
(context, index) { Widget content;
Widget child; if (_metadata.isEmpty) {
if (index == 0) { content = SizedBox.shrink();
child = SectionRow(AIcons.info);
} else if (index < untitledDirectoryCount + 1) {
child = _buildDirTileWithoutTitle(directoriesWithoutTitle[index - 1]);
} else { } else {
child = _buildDirTileWithTitle(directoriesWithTitle[index - 1 - untitledDirectoryCount]); final directoriesWithoutTitle = _metadata.where((dir) => dir.name.isEmpty).toList();
} final directoriesWithTitle = _metadata.where((dir) => dir.name.isNotEmpty).toList();
return AnimationConfiguration.staggeredList( content = Column(
position: index, children: AnimationConfiguration.toStaggeredList(
duration: Durations.staggeredAnimation, duration: Durations.staggeredAnimation,
delay: Durations.staggeredAnimationDelay, delay: Durations.staggeredAnimationDelay,
child: SlideAnimation( childAnimationBuilder: (child) => SlideAnimation(
verticalOffset: 50.0, verticalOffset: 50.0,
child: FadeInAnimation( child: FadeInAnimation(
child: child, child: child,
),
),
children: [
SectionRow(AIcons.info),
...directoriesWithoutTitle.map(_buildDirTileWithoutTitle),
...directoriesWithTitle.map(_buildDirTileWithTitle),
],
), ),
), );
}
return AnimationLimiter(
// we update the limiter key after fetching the metadata of a new entry,
// in order to restart the staggered animation of the metadata section
key: Key(_loadedMetadataUri.value),
child: content,
); );
}, },
childCount: 1 + metadata.length,
), ),
); );
} }
Widget _buildDirTileWithoutTitle(MetadataDirectory dir) { Widget _buildDirTileWithoutTitle(_MetadataDirectory dir) {
return InfoRowGroup(dir.tags, maxValueLength: Constants.infoGroupMaxValueLength); return InfoRowGroup(dir.tags, maxValueLength: Constants.infoGroupMaxValueLength);
} }
Widget _buildDirTileWithTitle(MetadataDirectory dir) { Widget _buildDirTileWithTitle(_MetadataDirectory dir) {
Widget thumbnail; Widget thumbnail;
final prefixChildren = <Widget>[]; final prefixChildren = <Widget>[];
switch (dir.name) { switch (dir.name) {
@ -123,13 +168,43 @@ class metadataSectionSliverState extends State<MetadataSectionSliver> with Autom
); );
} }
void _onMetadataChanged() {
_loadedMetadataUri.value = null;
_metadata = [];
_getMetadata();
}
Future<void> _getMetadata() async {
if (entry == null) return;
if (_loadedMetadataUri.value == entry.uri) return;
if (isVisible) {
final rawMetadata = await MetadataService.getAllMetadata(entry) ?? {};
_metadata = rawMetadata.entries.map((dirKV) {
final directoryName = dirKV.key as String ?? '';
final rawTags = dirKV.value as Map ?? {};
final tags = SplayTreeMap.of(Map.fromEntries(rawTags.entries.map((tagKV) {
final value = tagKV.value as String ?? '';
if (value.isEmpty) return null;
final tagName = tagKV.key as String ?? '';
return MapEntry(tagName, value);
}).where((kv) => kv != null)));
return _MetadataDirectory(directoryName, tags);
}).toList()
..sort((a, b) => compareAsciiUpperCase(a.name, b.name));
_loadedMetadataUri.value = entry.uri;
} else {
_metadata = [];
_loadedMetadataUri.value = null;
}
}
@override @override
bool get wantKeepAlive => true; bool get wantKeepAlive => true;
} }
class MetadataDirectory { class _MetadataDirectory {
final String name; final String name;
final SplayTreeMap<String, String> tags; final SplayTreeMap<String, String> tags;
const MetadataDirectory(this.name, this.tags); const _MetadataDirectory(this.name, this.tags);
} }

View file

@ -16,6 +16,7 @@ import 'package:aves/widgets/common/icons.dart';
import 'package:aves/widgets/stats/filter_table.dart'; import 'package:aves/widgets/stats/filter_table.dart';
import 'package:charts_flutter/flutter.dart' as charts; import 'package:charts_flutter/flutter.dart' as charts;
import 'package:collection/collection.dart'; import 'package:collection/collection.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:intl/intl.dart'; import 'package:intl/intl.dart';
import 'package:percent_indicator/linear_percent_indicator.dart'; import 'package:percent_indicator/linear_percent_indicator.dart';
@ -262,6 +263,6 @@ class EntryByMimeDatum {
@override @override
String toString() { String toString() {
return '[$runtimeType#$hashCode: mimeType=$mimeType, displayText=$displayText, entryCount=$entryCount]'; return '[$runtimeType#${shortHash(this)}: mimeType=$mimeType, displayText=$displayText, entryCount=$entryCount]';
} }
} }