info: expand long tag values on tap

This commit is contained in:
Thibault Deckers 2020-09-23 15:46:34 +09:00
parent b888b32c62
commit f553e8089f
2 changed files with 39 additions and 13 deletions

View file

@ -8,6 +8,7 @@ import 'package:aves/widgets/common/icons.dart';
import 'package:aves/widgets/fullscreen/info/basic_section.dart'; 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:flutter/gestures.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:tuple/tuple.dart'; import 'package:tuple/tuple.dart';
@ -190,10 +191,25 @@ class SectionRow extends StatelessWidget {
} }
} }
class InfoRowGroup extends StatelessWidget { class InfoRowGroup extends StatefulWidget {
final Map<String, String> keyValues; final Map<String, String> keyValues;
final int maxValueLength;
const InfoRowGroup(this.keyValues); const InfoRowGroup(
this.keyValues, {
this.maxValueLength = 0,
});
@override
_InfoRowGroupState createState() => _InfoRowGroupState();
}
class _InfoRowGroupState extends State<InfoRowGroup> {
final List<String> _expandedKeys = [];
Map<String, String> get keyValues => widget.keyValues;
int get maxValueLength => widget.maxValueLength;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
@ -204,20 +220,30 @@ class InfoRowGroup extends StatelessWidget {
children: [ children: [
SelectableText.rich( SelectableText.rich(
TextSpan( TextSpan(
children: keyValues.entries children: keyValues.entries.expand(
.expand( (kv) {
(kv) => [ final key = kv.key;
TextSpan(text: '${kv.key} ', style: TextStyle(color: Colors.white70, height: 1.7)), var value = kv.value;
TextSpan(text: '${kv.value}${kv.key == lastKey ? '' : '\n'}'), final showPreviewOnly = maxValueLength > 0 && value.length > maxValueLength && !_expandedKeys.contains(key);
], if (showPreviewOnly) {
) value = '${value.substring(0, maxValueLength)}';
.toList(), }
return [
TextSpan(text: '$key ', style: TextStyle(color: Colors.white70, height: 1.7)),
TextSpan(text: '$value${key == lastKey ? '' : '\n'}', recognizer: showPreviewOnly ? _buildTapRecognizer(key) : null),
];
},
).toList(),
), ),
style: TextStyle(fontFamily: 'Concourse'), style: TextStyle(fontFamily: 'Concourse'),
), ),
], ],
); );
} }
GestureRecognizer _buildTapRecognizer(String key) {
return TapGestureRecognizer()..onTap = () => setState(() => _expandedKeys.add(key));
}
} }
class BackUpNotification extends Notification {} class BackUpNotification extends Notification {}

View file

@ -85,7 +85,7 @@ class _MetadataSectionSliverState extends State<MetadataSectionSliver> with Auto
} }
if (index < untitledDirectoryCount + 1) { if (index < untitledDirectoryCount + 1) {
final dir = directoriesWithoutTitle[index - 1]; final dir = directoriesWithoutTitle[index - 1];
return InfoRowGroup(dir.tags); return InfoRowGroup(dir.tags, maxValueLength: maxValueLength);
} }
final dir = directoriesWithTitle[index - 1 - untitledDirectoryCount]; final dir = directoriesWithTitle[index - 1 - untitledDirectoryCount];
return Theme( return Theme(
@ -109,7 +109,7 @@ class _MetadataSectionSliverState extends State<MetadataSectionSliver> with Auto
Container( Container(
alignment: Alignment.topLeft, alignment: Alignment.topLeft,
padding: EdgeInsets.only(left: 8, right: 8, bottom: 8), padding: EdgeInsets.only(left: 8, right: 8, bottom: 8),
child: InfoRowGroup(dir.tags), child: InfoRowGroup(dir.tags, maxValueLength: maxValueLength),
), ),
], ],
baseColor: Colors.grey[900], baseColor: Colors.grey[900],
@ -133,7 +133,7 @@ class _MetadataSectionSliverState extends State<MetadataSectionSliver> with Auto
final value = tagKV.value as String ?? ''; final value = tagKV.value as String ?? '';
if (value.isEmpty) return null; if (value.isEmpty) return null;
final tagName = tagKV.key as String ?? ''; final tagName = tagKV.key as String ?? '';
return MapEntry(tagName, value.length > maxValueLength ? '${value.substring(0, maxValueLength)}' : value); return MapEntry(tagName, value);
}).where((kv) => kv != null))); }).where((kv) => kv != null)));
return _MetadataDirectory(directoryName, tags); return _MetadataDirectory(directoryName, tags);
}).toList() }).toList()