reverted page transition, added main app bar transition, fixed regular app bar spacing

This commit is contained in:
Thibault Deckers 2022-05-24 10:16:40 +09:00
parent 093387e6ed
commit 8cd29cbcc3
5 changed files with 86 additions and 26 deletions

View file

@ -126,7 +126,11 @@ class _AvesAppState extends State<AvesApp> with WidgetsBindingObserver {
// - `FadeUpwardsPageTransitionsBuilder` on Oreo / API 27 and below // - `FadeUpwardsPageTransitionsBuilder` on Oreo / API 27 and below
// - `OpenUpwardsPageTransitionsBuilder` on Pie / API 28 // - `OpenUpwardsPageTransitionsBuilder` on Pie / API 28
// - `ZoomPageTransitionsBuilder` on Android 10 / API 29 and above (default in Flutter v3.0.0) // - `ZoomPageTransitionsBuilder` on Android 10 / API 29 and above (default in Flutter v3.0.0)
? const PageTransitionsTheme() ? const PageTransitionsTheme(
builders: {
TargetPlatform.android: FadeUpwardsPageTransitionsBuilder(),
},
)
// strip page transitions used by `MaterialPageRoute` // strip page transitions used by `MaterialPageRoute`
: const DirectPageTransitionsTheme(); : const DirectPageTransitionsTheme();

View file

@ -13,6 +13,9 @@ class AvesAppBar extends StatelessWidget {
final Widget? bottom; final Widget? bottom;
final Object? transitionKey; final Object? transitionKey;
static const leadingHeroTag = 'appbar-leading';
static const titleHeroTag = 'appbar-title';
const AvesAppBar({ const AvesAppBar({
super.key, super.key,
required this.contentHeight, required this.contentHeight,
@ -49,9 +52,18 @@ class AvesAppBar extends StatelessWidget {
children: [ children: [
Padding( Padding(
padding: const EdgeInsets.symmetric(horizontal: 4), padding: const EdgeInsets.symmetric(horizontal: 4),
child: Hero(
tag: leadingHeroTag,
flightShuttleBuilder: _flightShuttleBuilder,
transitionOnUserGestures: true,
child: leading, child: leading,
), ),
),
Expanded( Expanded(
child: Hero(
tag: titleHeroTag,
flightShuttleBuilder: _flightShuttleBuilder,
transitionOnUserGestures: true,
child: AnimatedSwitcher( child: AnimatedSwitcher(
duration: context.read<DurationsData>().iconAnimation, duration: context.read<DurationsData>().iconAnimation,
child: Row( child: Row(
@ -63,6 +75,7 @@ class AvesAppBar extends StatelessWidget {
), ),
), ),
), ),
),
], ],
), ),
), ),
@ -77,6 +90,38 @@ class AvesAppBar extends StatelessWidget {
); );
} }
static Widget _flightShuttleBuilder(
BuildContext flightContext,
Animation<double> animation,
HeroFlightDirection direction,
BuildContext fromHero,
BuildContext toHero,
) {
final pushing = direction == HeroFlightDirection.push;
Widget popBuilder(context, child) => Opacity(opacity: 1 - animation.value, child: child);
Widget pushBuilder(context, child) => Opacity(opacity: animation.value, child: child);
return Material(
type: MaterialType.transparency,
child: DefaultTextStyle(
style: DefaultTextStyle.of(toHero).style,
child: Stack(
children: [
AnimatedBuilder(
animation: animation,
builder: pushing ? popBuilder : pushBuilder,
child: fromHero.widget,
),
AnimatedBuilder(
animation: animation,
builder: pushing ? pushBuilder : popBuilder,
child: toHero.widget,
),
],
),
),
);
}
static double appBarHeightForContentHeight(double contentHeight) => AvesFloatingBar.margin.vertical + contentHeight; static double appBarHeightForContentHeight(double contentHeight) => AvesFloatingBar.margin.vertical + contentHeight;
} }

View file

@ -3,8 +3,10 @@ import 'dart:ui';
import 'package:aves/theme/durations.dart'; import 'package:aves/theme/durations.dart';
import 'package:aves/utils/debouncer.dart'; import 'package:aves/utils/debouncer.dart';
import 'package:aves/widgets/common/extensions/build_context.dart'; import 'package:aves/widgets/common/extensions/build_context.dart';
import 'package:aves/widgets/common/identity/aves_app_bar.dart';
import 'package:aves/widgets/search/search_delegate.dart'; import 'package:aves/widgets/search/search_delegate.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
class SearchPage extends StatefulWidget { class SearchPage extends StatefulWidget {
static const routeName = '/search'; static const routeName = '/search';
@ -51,7 +53,10 @@ class _SearchPageState extends State<SearchPage> {
return; return;
} }
widget.animation.removeStatusListener(_onAnimationStatusChanged); widget.animation.removeStatusListener(_onAnimationStatusChanged);
Future.delayed(Durations.pageTransitionAnimation * timeDilation).then((_) {
if (!mounted) return;
_focusNode.requestFocus(); _focusNode.requestFocus();
});
} }
@override @override
@ -110,20 +115,28 @@ class _SearchPageState extends State<SearchPage> {
} }
return Scaffold( return Scaffold(
appBar: AppBar( appBar: AppBar(
leading: widget.delegate.buildLeading(context), leading: Hero(
title: DefaultTextStyle.merge( tag: AvesAppBar.leadingHeroTag,
transitionOnUserGestures: true,
child: Center(child: widget.delegate.buildLeading(context)),
),
title: Hero(
tag: AvesAppBar.titleHeroTag,
transitionOnUserGestures: true,
child: DefaultTextStyle.merge(
style: const TextStyle(fontFeatures: [FontFeature.disable('smcp')]), style: const TextStyle(fontFeatures: [FontFeature.disable('smcp')]),
child: TextField( child: TextField(
controller: widget.delegate.queryTextController, controller: widget.delegate.queryTextController,
focusNode: _focusNode, focusNode: _focusNode,
style: theme.textTheme.headline6,
textInputAction: TextInputAction.search,
onSubmitted: (_) => widget.delegate.showResults(context),
decoration: InputDecoration( decoration: InputDecoration(
border: InputBorder.none, border: InputBorder.none,
hintText: context.l10n.searchCollectionFieldHint, hintText: context.l10n.searchCollectionFieldHint,
hintStyle: theme.inputDecorationTheme.hintStyle, hintStyle: theme.inputDecorationTheme.hintStyle,
), ),
textInputAction: TextInputAction.search,
style: theme.textTheme.headline6,
onSubmitted: (_) => widget.delegate.showResults(context),
),
), ),
), ),
actions: widget.delegate.buildActions(context), actions: widget.delegate.buildActions(context),

View file

@ -96,7 +96,6 @@ class _SettingsPageState extends State<SettingsPage> with FeedbackMixin {
), ),
), ),
], ],
titleSpacing: 0,
), ),
body: GestureAreaProtectorStack( body: GestureAreaProtectorStack(
child: SafeArea( child: SafeArea(

View file

@ -74,7 +74,6 @@ class InfoAppBar extends StatelessWidget {
), ),
), ),
], ],
titleSpacing: 0,
floating: true, floating: true,
); );
} }