Skip to content

F
Front-End
Unverified Commit 582f35df authored by Hans Muller's avatar Hans Muller Committed by GitHub
Browse files
Options

PageTransitionsTheme, new MountainView page transition (#21715) 

MaterialPageRoute transitions are now defined by the Theme. Added (optional) support for Android P style page transitions.
parent eadd59a9
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 620 additions and 186 deletions
packages/flutter/lib/material.dart
View file @ 582f35df
......@@ -69,6 +69,7 @@ export 'src/material/material_localizations.dart';
export 'src/material/mergeable_material.dart';
export 'src/material/outline_button.dart';
export 'src/material/page.dart';
export 'src/material/page_transitions_theme.dart';
export 'src/material/paginated_data_table.dart';
export 'src/material/popup_menu.dart';
export 'src/material/progress_indicator.dart';
......
packages/flutter/lib/src/cupertino/route.dart
View file @ 582f35df
......@@ -92,7 +92,6 @@ class CupertinoPageRoute<T> extends PageRoute<T> {
RouteSettings settings,
this.maintainState = true,
bool fullscreenDialog = false,
this.hostRoute,
}) : assert(builder != null),
assert(maintainState != null),
assert(fullscreenDialog != null),
......@@ -151,16 +150,6 @@ class CupertinoPageRoute<T> extends PageRoute<T> {
@override
final bool maintainState;
/// The route that owns this one.
///
/// The [MaterialPageRoute] creates a [CupertinoPageRoute] to handle iOS-style
/// navigation. When this happens, the [MaterialPageRoute] is the [hostRoute]
/// of this [CupertinoPageRoute].
///
/// The [hostRoute] is responsible for calling [dispose] on the route. When
/// there is a [hostRoute], the [CupertinoPageRoute] must not be [install]ed.
final PageRoute<T> hostRoute;
@override
Duration get transitionDuration => const Duration(milliseconds: 350);
......@@ -181,52 +170,43 @@ class CupertinoPageRoute<T> extends PageRoute<T> {
return nextRoute is CupertinoPageRoute && !nextRoute.fullscreenDialog;
}
@override
void install(OverlayEntry insertionPoint) {
assert(() {
if (hostRoute == null)
return true;
throw FlutterError(
'Cannot install a subsidiary route (one with a hostRoute).\n'
'This route ($this) cannot be installed, because it has a host route ($hostRoute).'
);
}());
super.install(insertionPoint);
}
@override
void dispose() {
_backGestureController?.dispose();
_backGestureController = null;
_popGestureInProgress.remove(this);
super.dispose();
}
_CupertinoBackGestureController<T> _backGestureController;
/// Whether a pop gesture is currently underway.
/// True if a Cupertino pop gesture is currently underway for [route].
///
/// This starts returning true when pop gesture is started by the user. It
/// returns false if that has not yet occurred or if the most recent such
/// gesture has completed.
/// See also:
///
/// * [popGestureEnabled], which returns true if a user-triggered pop gesture
/// would be allowed.
static bool isPopGestureInProgress(PageRoute<dynamic> route) => _popGestureInProgress.contains(route);
static final Set<PageRoute<dynamic>> _popGestureInProgress = Set<PageRoute<dynamic>>();
/// True if a Cupertino pop gesture is currently underway for this route.
///
/// See also:
///
/// * [popGestureEnabled], which returns whether a pop gesture is appropriate
/// in the first place.
bool get popGestureInProgress => _backGestureController != null;
/// * [isPopGestureInProgress], which returns true if a Cupertino pop gesture
/// is currently underway for specific route.
/// * [popGestureEnabled], which returns true if a user-triggered pop gesture
/// would be allowed.
bool get popGestureInProgress => isPopGestureInProgress(this);
/// Whether a pop gesture can be started by the user.
///
/// This returns true if the user can edge-swipe to a previous route,
/// otherwise false.
/// Returns true if the user can edge-swipe to a previous route.
///
/// This will return false once [popGestureInProgress] is true, but
/// [popGestureInProgress] can only become true if [popGestureEnabled] was
/// Returns false once [isPopGestureInProgress] is true, but
/// [isPopGestureInProgress] can only become true if [popGestureEnabled] was
/// true first.
///
/// This should only be used between frames, not during build.
bool get popGestureEnabled {
final PageRoute<T> route = hostRoute ?? this;
bool get popGestureEnabled => _isPopGestureEnabled(this);
static bool _isPopGestureEnabled<T>(PageRoute<T> route) {
// If there's nothing to go back to, then obviously we don't support
// the back gesture.
if (route.isFirst)
......@@ -240,54 +220,19 @@ class CupertinoPageRoute<T> extends PageRoute<T> {
if (route.hasScopedWillPopCallback)
return false;
// Fullscreen dialogs aren't dismissable by back swipe.
if (fullscreenDialog)
if (route.fullscreenDialog)
return false;
// If we're in an animation already, we cannot be manually swiped.
if (route.controller.status != AnimationStatus.completed)
return false;
// If we're in a gesture already, we cannot start another.
if (popGestureInProgress)
if (_popGestureInProgress.contains(route))
return false;
// Looks like a back gesture would be welcome!
return true;
}
/// Begin dismissing this route from a horizontal swipe, if appropriate.
///
/// Swiping will be disabled if the page is a fullscreen dialog or if
/// dismissals can be overridden because a [WillPopCallback] was
/// defined for the route.
///
/// When this method decides a pop gesture is appropriate, it returns a
/// [CupertinoBackGestureController].
///
/// See also:
///
/// * [hasScopedWillPopCallback], which is true if a `willPop` callback
/// is defined for this route.
/// * [popGestureEnabled], which returns whether a pop gesture is
/// appropriate.
/// * [Route.startPopGesture], which describes the contract that this method
/// must implement.
_CupertinoBackGestureController<T> _startPopGesture() {
assert(!popGestureInProgress);
assert(popGestureEnabled);
final PageRoute<T> route = hostRoute ?? this;
_backGestureController = _CupertinoBackGestureController<T>(
navigator: route.navigator,
controller: route.controller,
onEnded: _endPopGesture,
);
return _backGestureController;
}
void _endPopGesture() {
// In practice this only gets called if for some reason popping the route
// did not cause this route to get disposed.
_backGestureController?.dispose();
_backGestureController = null;
}
@override
Widget buildPage(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) {
final Widget result = Semantics(
......@@ -307,9 +252,49 @@ class CupertinoPageRoute<T> extends PageRoute<T> {
return result;
}
@override
Widget buildTransitions(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
if (fullscreenDialog) {
// Called by _CupertinoBackGestureDetector when a pop ("back") drag start
// gesture is detected. The returned controller handles all of the subsquent
// drag events.
static _CupertinoBackGestureController<T> _startPopGesture<T>(PageRoute<T> route) {
assert(!_popGestureInProgress.contains(route));
assert(_isPopGestureEnabled(route));
_popGestureInProgress.add(route);
_CupertinoBackGestureController<T> backController;
backController = _CupertinoBackGestureController<T>(
navigator: route.navigator,
controller: route.controller,
onEnded: () {
backController?.dispose();
backController = null;
_popGestureInProgress.remove(route);
},
);
return backController;
}
/// Returns a [CupertinoFullscreenDialogTransition] if [route] is a full
/// screen dialog, otherwise a [CupertinoPageTransition] is returned.
///
/// Used by [CupertinoPageRoute.buildTransitions].
///
/// This method can be applied to any [PageRoute], not just
/// [CupertinoPageRoute]. It's typically used to provide a Cupertino style
/// horizontal transition for material widgets when the target platform
/// is [TargetPlatform.iOS].
///
/// See also:
///
/// * [CupertinoPageTransitionsBuilder], which uses this method to define a
/// [PageTransitionsBuilder] for the [PageTransitionsTheme].
static Widget buildPageTransitions<T>(
PageRoute<T> route,
BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
Widget child,
) {
if (route.fullscreenDialog) {
return CupertinoFullscreenDialogTransition(
animation: animation,
child: child,
......@@ -320,16 +305,21 @@ class CupertinoPageRoute<T> extends PageRoute<T> {
secondaryRouteAnimation: secondaryAnimation,
// In the middle of a back gesture drag, let the transition be linear to
// match finger motions.
linearTransition: popGestureInProgress,
linearTransition: _popGestureInProgress.contains(route),
child: _CupertinoBackGestureDetector<T>(
enabledCallback: () => popGestureEnabled,
onStartPopGesture: _startPopGesture,
enabledCallback: () => _isPopGestureEnabled<T>(route),
onStartPopGesture: () => _startPopGesture<T>(route),
child: child,
),
);
}
}
@override
Widget buildTransitions(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
return buildPageTransitions<T>(this, context, animation, secondaryAnimation, child);
}
@override
String get debugLabel => '${super.debugLabel}(${settings.name})';
}
......@@ -385,11 +375,10 @@ class CupertinoPageTransition extends StatelessWidget {
Widget build(BuildContext context) {
assert(debugCheckHasDirectionality(context));
final TextDirection textDirection = Directionality.of(context);
// TODO(ianh): tell the transform to be un-transformed for hit testing
// but not while being controlled by a gesture.
return SlideTransition(
position: _secondaryPositionAnimation,
textDirection: textDirection,
transformHitTests: false,
child: SlideTransition(
position: _primaryPositionAnimation,
textDirection: textDirection,
......@@ -917,4 +906,4 @@ Future<T> showCupertinoDialog<T>({
},
transitionBuilder: _buildCupertinoDialogTransitions,
);
}
\ No newline at end of file
}
packages/flutter/lib/src/material/page.dart
View file @ 582f35df
......@@ -5,47 +5,9 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/widgets.dart';
import 'page_transitions_theme.dart';
import 'theme.dart';
// Fractional offset from 1/4 screen below the top to fully on screen.
final Animatable<Offset> _kBottomUpTween = Tween<Offset>(
begin: const Offset(0.0, 0.25),
end: Offset.zero,
);
// Used for Android and Fuchsia.
class _MountainViewPageTransition extends StatelessWidget {
_MountainViewPageTransition({
Key key,
@required bool fade,
@required Animation<double> routeAnimation, // The route's linear 0.0 - 1.0 animation.
@required this.child,
}) : _positionAnimation = routeAnimation.drive(_kBottomUpTween.chain(_fastOutSlowInTween)),
_opacityAnimation = fade
? routeAnimation.drive(_easeInTween) // Eyeballed from other Material apps.
: const AlwaysStoppedAnimation<double>(1.0),
super(key: key);
static final Animatable<double> _fastOutSlowInTween = CurveTween(curve: Curves.fastOutSlowIn);
static final Animatable<double> _easeInTween = CurveTween(curve: Curves.easeIn);
final Animation<Offset> _positionAnimation;
final Animation<double> _opacityAnimation;
final Widget child;
@override
Widget build(BuildContext context) {
// TODO(ianh): tell the transform to be un-transformed for hit testing
return SlideTransition(
position: _positionAnimation,
child: FadeTransition(
opacity: _opacityAnimation,
child: child,
),
);
}
}
/// A modal route that replaces the entire screen with a platform-adaptive
/// transition.
///
......@@ -71,16 +33,22 @@ class _MountainViewPageTransition extends StatelessWidget {
///
/// See also:
///
/// * [CupertinoPageRoute], which this [PageRoute] delegates transition
/// animations to for iOS.
/// * [PageTransitionsTheme], which defines the default page transitions used
/// by [MaterialPageRoute.buildTransitions].
///
class MaterialPageRoute<T> extends PageRoute<T> {
/// Creates a page route for use in a material design app.
/// Construct a MaterialPageRoute whose contents are defined by [builder].
///
/// The values of [builder], [maintainState], and [fullScreenDialog] must not
/// be null.
MaterialPageRoute({
@required this.builder,
RouteSettings settings,
this.maintainState = true,
bool fullscreenDialog = false,
}) : assert(builder != null),
assert(maintainState != null),
assert(fullscreenDialog != null),
super(settings: settings, fullscreenDialog: fullscreenDialog) {
// ignore: prefer_asserts_in_initializer_lists , https://github.com/dart-lang/sdk/issues/31223
assert(opaque);
......@@ -92,26 +60,6 @@ class MaterialPageRoute<T> extends PageRoute<T> {
@override
final bool maintainState;
/// A delegate PageRoute to which iOS themed page operations are delegated to.
/// It's lazily created on first use.
CupertinoPageRoute<T> get _cupertinoPageRoute {
assert(_useCupertinoTransitions);
_internalCupertinoPageRoute ??= CupertinoPageRoute<T>(
builder: builder, // Not used.
fullscreenDialog: fullscreenDialog,
hostRoute: this,
);
return _internalCupertinoPageRoute;
}
CupertinoPageRoute<T> _internalCupertinoPageRoute;
/// Whether we should currently be using Cupertino transitions. This is true
/// if the theme says we're on iOS, or if we're in an active gesture.
bool get _useCupertinoTransitions {
return _internalCupertinoPageRoute?.popGestureInProgress == true
|| Theme.of(navigator.context).platform == TargetPlatform.iOS;
}
@override
Duration get transitionDuration => const Duration(milliseconds: 300);
......@@ -133,12 +81,6 @@ class MaterialPageRoute<T> extends PageRoute<T> {
|| (nextRoute is CupertinoPageRoute && !nextRoute.fullscreenDialog);
}
@override
void dispose() {
_internalCupertinoPageRoute?.dispose();
super.dispose();
}
@override
Widget buildPage(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) {
final Widget result = Semantics(
......@@ -160,15 +102,8 @@ class MaterialPageRoute<T> extends PageRoute<T> {
@override
Widget buildTransitions(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
if (_useCupertinoTransitions) {
return _cupertinoPageRoute.buildTransitions(context, animation, secondaryAnimation, child);
} else {
return _MountainViewPageTransition(
routeAnimation: animation,
child: child,
fade: true,
);
}
final PageTransitionsTheme theme = Theme.of(context).pageTransitionsTheme;
return theme.buildTransitions<T>(this, context, animation, secondaryAnimation, child);
}
@override
......
packages/flutter/lib/src/material/page_transitions_theme.dart 0 → 100644
View file @ 582f35df
This diff is collapsed.
packages/flutter/lib/src/rendering/viewport.dart
View file @ 582f35df
......@@ -917,7 +917,7 @@ abstract class RenderViewportBase<ParentDataClass extends ContainerParentDataMix
/// The parameters `viewport` and `offset` are required and cannot be null.
/// If `descendant` is null, this is a no-op and `rect` is returned.
///
/// If both `decedent` and `rect` are null, null is returned because there is
/// If both `descendant` and `rect` are null, null is returned because there is
/// nothing to be shown in the viewport.
///
/// The `duration` parameter can be set to a non-zero value to animate the
......
packages/flutter/test/material/page_transitions_theme_test.dart 0 → 100644
View file @ 582f35df
// Copyright 2018 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
void main() {
testWidgets('Default PageTranstionsTheme platform', (WidgetTester tester) async {
await tester.pumpWidget(MaterialApp(home: const Text('home')));
final PageTransitionsTheme theme = Theme.of(tester.element(find.text('home'))).pageTransitionsTheme;
expect(theme.builders, isNotNull);
expect(theme.builders[TargetPlatform.android], isNotNull);
expect(theme.builders[TargetPlatform.iOS], isNotNull);
});
testWidgets('Default PageTranstionsTheme builds a CupertionPageTransition for iOS', (WidgetTester tester) async {
final Map<String, WidgetBuilder> routes = <String, WidgetBuilder>{
'/': (BuildContext context) => Material(
child: FlatButton(
child: const Text('push'),
onPressed: () { Navigator.of(context).pushNamed('/b'); },
),
),
'/b': (BuildContext context) => const Text('page b'),
};
await tester.pumpWidget(
MaterialApp(
theme: ThemeData(platform: TargetPlatform.iOS),
routes: routes,
),
);
expect(Theme.of(tester.element(find.text('push'))).platform, TargetPlatform.iOS);
expect(find.byType(CupertinoPageTransition), findsOneWidget);
await tester.tap(find.text('push'));
await tester.pumpAndSettle();
expect(find.text('page b'), findsOneWidget);
expect(find.byType(CupertinoPageTransition), findsOneWidget);
});
testWidgets('Default PageTranstionsTheme builds a _FadeUpwardsPageTransition for android', (WidgetTester tester) async {
final Map<String, WidgetBuilder> routes = <String, WidgetBuilder>{
'/': (BuildContext context) => Material(
child: FlatButton(
child: const Text('push'),
onPressed: () { Navigator.of(context).pushNamed('/b'); },
),
),
'/b': (BuildContext context) => const Text('page b'),
};
await tester.pumpWidget(
MaterialApp(
theme: ThemeData(platform: TargetPlatform.android),
routes: routes,
),
);
Finder findFadeUpwardsPageTransition() {
return find.descendant(
of: find.byType(MaterialApp),
matching: find.byWidgetPredicate((Widget w) => '${w.runtimeType}' == '_FadeUpwardsPageTransition'),
);
}
expect(Theme.of(tester.element(find.text('push'))).platform, TargetPlatform.android);
expect(findFadeUpwardsPageTransition(), findsOneWidget);
await tester.tap(find.text('push'));
await tester.pumpAndSettle();
expect(find.text('page b'), findsOneWidget);
expect(findFadeUpwardsPageTransition(), findsOneWidget);
});
testWidgets('pageTranstionsTheme override builds a _OpenUpwardsPageTransition for android', (WidgetTester tester) async {
final Map<String, WidgetBuilder> routes = <String, WidgetBuilder>{
'/': (BuildContext context) => Material(
child: FlatButton(
child: const Text('push'),
onPressed: () { Navigator.of(context).pushNamed('/b'); },
),
),
'/b': (BuildContext context) => const Text('page b'),
};
await tester.pumpWidget(
MaterialApp(
theme: ThemeData(
platform: TargetPlatform.android,
pageTransitionsTheme: const PageTransitionsTheme(
builders: <TargetPlatform, PageTransitionsBuilder>{
TargetPlatform.android: OpenUpwardsPageTransitionsBuilder(), // creates a _OpenUpwardsPageTransition
},
),
),
routes: routes,
),
);
Finder findOpenUpwardsPageTransition() {
return find.descendant(
of: find.byType(MaterialApp),
matching: find.byWidgetPredicate((Widget w) => '${w.runtimeType}' == '_OpenUpwardsPageTransition'),
);
}
expect(Theme.of(tester.element(find.text('push'))).platform, TargetPlatform.android);
expect(findOpenUpwardsPageTransition(), findsOneWidget);
await tester.tap(find.text('push'));
await tester.pumpAndSettle();
expect(find.text('page b'), findsOneWidget);
expect(findOpenUpwardsPageTransition(), findsOneWidget);
});
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

HIAST - GitLab