tv: safe area, app bar leading

This commit is contained in:
Thibault Deckers 2023-01-05 19:24:21 +01:00
parent b343e32db0
commit 665a79c488
17 changed files with 213 additions and 125 deletions

View file

@ -47,7 +47,6 @@ class AboutPage extends StatelessWidget {
);
if (settings.useTvLayout) {
final isRtl = context.isRtl;
return Scaffold(
body: AvesPopScope(
handlers: const [TvNavigationPopHandler.pop],
@ -57,9 +56,8 @@ class AboutPage extends StatelessWidget {
controller: context.read<TvRailController>(),
),
Expanded(
child: SafeArea(
left: isRtl,
right: !isRtl,
child: DirectionalSafeArea(
start: false,
child: body,
),
),

View file

@ -136,11 +136,7 @@ class _AvesAppState extends State<AvesApp> with WidgetsBindingObserver {
final Set<String> _changedUris = {};
Size? _screenSize;
// Flutter has various page transition implementations for Android:
// - `FadeUpwardsPageTransitionsBuilder` on Oreo / API 27 and below
// - `OpenUpwardsPageTransitionsBuilder` on Pie / API 28
// - `ZoomPageTransitionsBuilder` on Android 10 / API 29 and above (default in Flutter v3.0.0)
final ValueNotifier<PageTransitionsBuilder> _pageTransitionsBuilderNotifier = ValueNotifier(const FadeUpwardsPageTransitionsBuilder());
final ValueNotifier<PageTransitionsBuilder> _pageTransitionsBuilderNotifier = ValueNotifier(defaultPageTransitionsBuilder);
final ValueNotifier<TvMediaQueryModifier?> _tvMediaQueryModifierNotifier = ValueNotifier(null);
final ValueNotifier<AppMode> _appModeNotifier = ValueNotifier(AppMode.main);
@ -152,6 +148,12 @@ class _AvesAppState extends State<AvesApp> with WidgetsBindingObserver {
final EventChannel _analysisCompletionChannel = const OptionalEventChannel('deckers.thibault/aves/analysis_events');
final EventChannel _errorChannel = const OptionalEventChannel('deckers.thibault/aves/error');
// Flutter has various page transition implementations for Android:
// - `FadeUpwardsPageTransitionsBuilder` on Oreo / API 27 and below
// - `OpenUpwardsPageTransitionsBuilder` on Pie / API 28
// - `ZoomPageTransitionsBuilder` on Android 10 / API 29 and above (default in Flutter v3.0.0)
static const defaultPageTransitionsBuilder = FadeUpwardsPageTransitionsBuilder();
@override
void initState() {
super.initState();
@ -420,7 +422,19 @@ class _AvesAppState extends State<AvesApp> with WidgetsBindingObserver {
await settings.init(monitorPlatformSettings: true);
settings.isRotationLocked = await windowService.isRotationLocked();
settings.areAnimationsRemoved = await AccessibilityService.areAnimationsRemoved();
await _onTvLayoutChanged();
_monitorSettings();
FijkLog.setLevel(FijkLogLevel.Warn);
unawaited(_setupErrorReporting());
debugPrint('App setup in ${stopwatch.elapsed.inMilliseconds}ms');
}
Future<void> _onTvLayoutChanged() async {
if (settings.useTvLayout) {
settings.applyTvSettings();
_pageTransitionsBuilderNotifier.value = const TvPageTransitionsBuilder();
_tvMediaQueryModifierNotifier.value = (mq) => mq.copyWith(
textScaleFactor: 1.1,
@ -429,13 +443,11 @@ class _AvesAppState extends State<AvesApp> with WidgetsBindingObserver {
if (settings.forceTvLayout) {
await windowService.requestOrientation(Orientation.landscape);
}
} else {
_pageTransitionsBuilderNotifier.value = defaultPageTransitionsBuilder;
_tvMediaQueryModifierNotifier.value = null;
await windowService.requestOrientation(null);
}
_monitorSettings();
FijkLog.setLevel(FijkLogLevel.Warn);
unawaited(_setupErrorReporting());
debugPrint('App setup in ${stopwatch.elapsed.inMilliseconds}ms');
}
void _monitorSettings() {
@ -457,22 +469,26 @@ class _AvesAppState extends State<AvesApp> with WidgetsBindingObserver {
}
void applyForceTvLayout() {
settings.applyTvSettings();
windowService.requestOrientation(settings.forceTvLayout ? Orientation.landscape : null);
AvesApp.navigatorKey.currentState!.pushAndRemoveUntil(
_onTvLayoutChanged();
unawaited(AvesApp.navigatorKey.currentState!.pushAndRemoveUntil(
MaterialPageRoute(
settings: const RouteSettings(name: HomePage.routeName),
builder: (_) => _getFirstPage(),
),
(route) => false,
);
));
}
settings.updateStream.where((event) => event.key == Settings.isInstalledAppAccessAllowedKey).listen((_) => applyIsInstalledAppAccessAllowed());
settings.updateStream.where((event) => event.key == Settings.displayRefreshRateModeKey).listen((_) => applyDisplayRefreshRateMode());
settings.updateStream.where((event) => event.key == Settings.keepScreenOnKey).listen((_) => applyKeepScreenOn());
settings.updateStream.where((event) => event.key == Settings.platformAccelerometerRotationKey).listen((_) => applyIsRotationLocked());
settings.updateStream.where((event) => event.key == Settings.forceTvLayoutKey).listen((_) => applyForceTvLayout());
final settingStream = settings.updateStream;
// app
settingStream.where((event) => event.key == Settings.isInstalledAppAccessAllowedKey).listen((_) => applyIsInstalledAppAccessAllowed());
// display
settingStream.where((event) => event.key == Settings.displayRefreshRateModeKey).listen((_) => applyDisplayRefreshRateMode());
settingStream.where((event) => event.key == Settings.forceTvLayoutKey).listen((_) => applyForceTvLayout());
// navigation
settingStream.where((event) => event.key == Settings.keepScreenOnKey).listen((_) => applyKeepScreenOn());
// platform settings
settingStream.where((event) => event.key == Settings.platformAccelerometerRotationKey).listen((_) => applyIsRotationLocked());
applyDisplayRefreshRateMode();
applyKeepScreenOn();

View file

@ -82,6 +82,7 @@ class _CollectionPageState extends State<CollectionPage> {
@override
Widget build(BuildContext context) {
final useTvLayout = settings.useTvLayout;
final liveFilter = _collection.filters.firstWhereOrNull((v) => v is QueryFilter && v.live) as QueryFilter?;
return SelectionProvider<AvesEntry>(
child: Selector<Selection<AvesEntry>, bool>(
@ -104,11 +105,12 @@ class _CollectionPageState extends State<CollectionPage> {
TvNavigationPopHandler.pop,
_doubleBackPopHandler.pop,
],
child: const GestureAreaProtectorStack(
child: SafeArea(
child: GestureAreaProtectorStack(
child: DirectionalSafeArea(
start: !useTvLayout,
top: false,
bottom: false,
child: CollectionGrid(
child: const CollectionGrid(
// key is expected by test driver
key: Key('collection-grid'),
settingsRouteKey: CollectionPage.routeName,
@ -121,7 +123,7 @@ class _CollectionPageState extends State<CollectionPage> {
);
Widget page;
if (settings.useTvLayout) {
if (useTvLayout) {
page = Scaffold(
body: Row(
children: [

View file

@ -2,6 +2,7 @@ import 'dart:math';
import 'package:aves/model/settings/settings.dart';
import 'package:aves/widgets/aves_app.dart';
import 'package:aves/widgets/common/extensions/build_context.dart';
import 'package:aves/widgets/common/extensions/media_query.dart';
import 'package:aves/widgets/common/providers/media_query_data_provider.dart';
import 'package:aves/widgets/common/tile_extent_controller.dart';
@ -188,3 +189,35 @@ extension ExtraMediaQueryData on MediaQueryData {
);
}
}
class DirectionalSafeArea extends StatelessWidget {
final bool start, top, end, bottom;
final EdgeInsets minimum;
final bool maintainBottomViewPadding;
final Widget child;
const DirectionalSafeArea({
super.key,
this.start = true,
this.top = true,
this.end = true,
this.bottom = true,
this.minimum = EdgeInsets.zero,
this.maintainBottomViewPadding = false,
required this.child,
});
@override
Widget build(BuildContext context) {
final isRtl = context.isRtl;
return SafeArea(
left: isRtl ? end : start,
top: top,
right: isRtl ? start : end,
bottom: bottom,
minimum: minimum,
maintainBottomViewPadding: maintainBottomViewPadding,
child: child,
);
}
}

View file

@ -2,6 +2,7 @@ import 'package:aves/model/settings/settings.dart';
import 'package:aves/theme/colors.dart';
import 'package:aves/theme/durations.dart';
import 'package:aves/widgets/aves_app.dart';
import 'package:aves/widgets/common/basic/insets.dart';
import 'package:aves/widgets/common/fx/blurred.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
@ -32,12 +33,14 @@ class AvesAppBar extends StatelessWidget {
return Selector<MediaQueryData, double>(
selector: (context, mq) => mq.padding.top,
builder: (context, mqPaddingTop, child) {
final useTvLayout = settings.useTvLayout;
return SliverPersistentHeader(
floating: !settings.useTvLayout,
floating: !useTvLayout,
pinned: false,
delegate: _SliverAppBarDelegate(
height: mqPaddingTop + appBarHeightForContentHeight(contentHeight),
child: SafeArea(
child: DirectionalSafeArea(
start: !useTvLayout,
bottom: false,
child: AvesFloatingBar(
builder: (context, backgroundColor, child) => Material(

View file

@ -77,10 +77,12 @@ class FilterGridPage<T extends CollectionFilter> extends StatelessWidget {
@override
Widget build(BuildContext context) {
final useTvLayout = settings.useTvLayout;
final body = QueryProvider(
initialQuery: null,
child: GestureAreaProtectorStack(
child: SafeArea(
child: DirectionalSafeArea(
start: !useTvLayout,
top: false,
bottom: false,
child: Selector<MediaQueryData, double>(
@ -112,7 +114,7 @@ class FilterGridPage<T extends CollectionFilter> extends StatelessWidget {
),
);
if (settings.useTvLayout) {
if (useTvLayout) {
return Scaffold(
body: Row(
children: [

View file

@ -9,6 +9,7 @@ import 'package:aves/model/source/collection_lens.dart';
import 'package:aves/model/source/collection_source.dart';
import 'package:aves/widgets/about/about_page.dart';
import 'package:aves/widgets/collection/collection_page.dart';
import 'package:aves/widgets/common/basic/insets.dart';
import 'package:aves/widgets/common/extensions/build_context.dart';
import 'package:aves/widgets/common/identity/aves_logo.dart';
import 'package:aves/widgets/debug/app_debug_page.dart';
@ -32,6 +33,8 @@ class TvRail extends StatefulWidget {
final CollectionLens? currentCollection;
final TvRailController controller;
static const double minExtendedWidth = 256;
const TvRail({
super.key,
required this.controller,
@ -44,6 +47,7 @@ class TvRail extends StatefulWidget {
class _TvRailState extends State<TvRail> {
late final ScrollController _scrollController;
final ValueNotifier<bool> _extendedNotifier = ValueNotifier(true);
final FocusNode _focusNode = FocusNode();
TvRailController get controller => widget.controller;
@ -64,15 +68,24 @@ class _TvRailState extends State<TvRail> {
void dispose() {
_scrollController.removeListener(_onScrollChanged);
_scrollController.dispose();
_extendedNotifier.dispose();
_focusNode.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
final header = Row(
final navEntries = _getNavEntries(context);
return DirectionalSafeArea(
end: false,
child: ValueListenableBuilder<bool>(
valueListenable: _extendedNotifier,
builder: (context, extended, child) {
const logo = AvesLogo(size: 48);
final header = extended
? Row(
children: [
const AvesLogo(size: 48),
logo,
const SizedBox(width: 16),
Text(
context.l10n.appName,
@ -85,16 +98,15 @@ class _TvRailState extends State<TvRail> {
),
),
],
);
final navEntries = _getNavEntries(context);
)
: logo;
final rail = Focus(
focusNode: _focusNode,
skipTraversal: true,
child: NavigationRail(
backgroundColor: Theme.of(context).scaffoldBackgroundColor,
extended: true,
extended: extended,
destinations: navEntries
.map((v) => NavigationRailDestination(
icon: v.icon,
@ -106,11 +118,11 @@ class _TvRailState extends State<TvRail> {
controller.focusedIndex = index;
navEntries[index].onSelection();
},
minExtendedWidth: TvRail.minExtendedWidth,
),
);
return SafeArea(
child: Column(
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const SizedBox(height: 8),
@ -130,6 +142,8 @@ class _TvRailState extends State<TvRail> {
),
),
],
);
},
),
);
}

View file

@ -113,6 +113,7 @@ class SettingsTileDisplayForceTvLayout extends SettingsTile {
Widget build(BuildContext context) => SettingsSwitchListTile(
selector: (context, s) => s.forceTvLayout,
onChanged: (v) async {
if (v) {
final confirmed = await showDialog<bool>(
context: context,
builder: (context) {
@ -136,6 +137,7 @@ class SettingsTileDisplayForceTvLayout extends SettingsTile {
},
);
if (confirmed == null || !confirmed) return;
}
settings.forceTvLayout = v;
},

View file

@ -30,8 +30,10 @@ class _LocaleSelectionPageState extends State<LocaleSelectionPage> {
@override
Widget build(BuildContext context) {
final useTvLayout = settings.useTvLayout;
return Scaffold(
appBar: AppBar(
automaticallyImplyLeading: !useTvLayout,
title: Text(context.l10n.settingsLanguagePageTitle),
),
body: SafeArea(
@ -41,6 +43,7 @@ class _LocaleSelectionPageState extends State<LocaleSelectionPage> {
final upQuery = query.toUpperCase().trim();
return ListView(
children: [
if (!useTvLayout)
QueryBar(
queryNotifier: _queryNotifier,
leadingPadding: const EdgeInsetsDirectional.only(start: 24, end: 8),

View file

@ -93,6 +93,7 @@ class _NavigationDrawerEditorPageState extends State<NavigationDrawerEditorPage>
length: tabs.length,
child: Scaffold(
appBar: AppBar(
automaticallyImplyLeading: !settings.useTvLayout,
title: Text(l10n.settingsNavigationDrawerEditorPageTitle),
bottom: TabBar(
tabs: tabs.map((t) => t.item1).toList(),

View file

@ -150,13 +150,15 @@ class _FilePickerPageState extends State<FilePickerPage> {
return Drawer(
child: ListView(
children: [
Padding(
SafeArea(
child: Padding(
padding: const EdgeInsets.all(16),
child: Text(
context.l10n.filePickerOpenFrom,
style: Theme.of(context).textTheme.headlineSmall,
),
),
),
...volumes.map((v) {
final icon = v.isRemovable ? AIcons.removableStorage : AIcons.mainStorage;
return ListTile(

View file

@ -36,6 +36,7 @@ class HiddenItemsPage extends StatelessWidget {
length: tabs.length,
child: Scaffold(
appBar: AppBar(
automaticallyImplyLeading: !settings.useTvLayout,
title: Text(l10n.settingsHiddenItemsPageTitle),
bottom: TabBar(
tabs: tabs.map((t) => t.item1).toList(),

View file

@ -106,6 +106,7 @@ class _SettingsPageState extends State<SettingsPage> with FeedbackMixin {
.toList(),
selectedIndex: selectedIndex,
onDestinationSelected: (index) => _tvSelectedIndexNotifier.value = index,
minExtendedWidth: TvRail.minExtendedWidth,
);
return LayoutBuilder(
builder: (context, constraints) {
@ -118,10 +119,15 @@ class _SettingsPageState extends State<SettingsPage> with FeedbackMixin {
),
),
Expanded(
child: MediaQuery.removePadding(
context: context,
removeLeft: !context.isRtl,
removeRight: context.isRtl,
child: _SettingsSectionBody(
loader: Future.value(sections[selectedIndex].tiles(context)),
),
),
),
],
);
},

View file

@ -19,6 +19,7 @@ class ThumbnailOverlayPage extends StatelessWidget {
return Scaffold(
appBar: AppBar(
automaticallyImplyLeading: !settings.useTvLayout,
title: Text(context.l10n.settingsThumbnailOverlayPageTitle),
),
body: SafeArea(

View file

@ -18,6 +18,7 @@ class SubtitleThemePage extends StatelessWidget {
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
automaticallyImplyLeading: !settings.useTvLayout,
title: Text(context.l10n.settingsSubtitleThemePageTitle),
),
body: SafeArea(

View file

@ -12,14 +12,16 @@ class ViewerOverlayPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
final useTvLayout = settings.useTvLayout;
return Scaffold(
appBar: AppBar(
automaticallyImplyLeading: !useTvLayout,
title: Text(context.l10n.settingsViewerOverlayPageTitle),
),
body: SafeArea(
child: ListView(
children: [
if (!settings.useTvLayout)
if (!useTvLayout)
SettingsSwitchListTile(
selector: (context, s) => s.showOverlayOnOpening,
onChanged: (v) => settings.showOverlayOnOpening = v,
@ -67,13 +69,13 @@ class ViewerOverlayPage extends StatelessWidget {
);
},
),
if (!settings.useTvLayout)
if (!useTvLayout)
SettingsSwitchListTile(
selector: (context, s) => s.showOverlayMinimap,
onChanged: (v) => settings.showOverlayMinimap = v,
title: context.l10n.settingsViewerShowMinimap,
),
if (!settings.useTvLayout)
if (!useTvLayout)
SettingsSwitchListTile(
selector: (context, s) => s.showOverlayThumbnailPreview,
onChanged: (v) => settings.showOverlayThumbnailPreview = v,

View file

@ -16,6 +16,7 @@ class ViewerSlideshowPage extends StatelessWidget {
final l10n = context.l10n;
return Scaffold(
appBar: AppBar(
automaticallyImplyLeading: !settings.useTvLayout,
title: Text(l10n.settingsViewerSlideshowPageTitle),
),
body: SafeArea(