Added ability to define transition type when defining route (#63)

* Added ability to define transition type when defining route
* fixes to allow transition overrides. make route transition type optional (non-positional) and null by default. other fixes. NEEDS TESTING
* formatting changes
* fixed typo
This commit is contained in:
Jon Samwell 2018-12-14 08:53:54 +11:00 committed by Luke
parent 79e35c5768
commit a11dd62910
8 changed files with 50 additions and 23 deletions

1
.gitignore vendored
View File

@ -10,3 +10,4 @@ pubspec.lock
coverage
__temp_coverage*
.dart_tool/
build/

View File

@ -59,6 +59,9 @@ var usersHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynam
void defineRoutes(Router router) {
router.define("/users/:id", handler: usersHandler);
// it is also possible to define the route transition to use
// router.define("users/:id", handler: usersHandler, transitionType: TransitionType.inFromLeft);
}
```

View File

@ -29,6 +29,7 @@ class AppComponentState extends State<AppComponent> {
Widget build(BuildContext context) {
final app = new MaterialApp(
title: 'Fluro',
debugShowCheckedModeBanner: false,
theme: new ThemeData(
primarySwatch: Colors.blue,
),

View File

@ -100,8 +100,8 @@ class HomeComponentState extends State<HomeComponent> {
width: 200.0),
),
menuButton(context, "Native Animation", "native"),
menuButton(context, "Preset (In from Left)", "preset-from-left"),
menuButton(context, "Preset (Fade In)", "preset-fade"),
menuButton(context, "Preset (Global transition)", "fixed-trans"),
menuButton(context, "Custom Transition", "custom"),
menuButton(context, "Navigator Result", "pop-result"),
menuButton(context, "Function Call", "function-call"),
@ -154,7 +154,7 @@ class HomeComponentState extends State<HomeComponent> {
String hexCode = "#FFFFFF";
String result;
TransitionType transitionType = TransitionType.native;
if (key != "custom" && key != "function-call") {
if (key != "custom" && key != "function-call" && key != "fixed-trans") {
if (key == "native") {
hexCode = "#F76F00";
message =
@ -210,6 +210,9 @@ class HomeComponentState extends State<HomeComponent> {
transitionBuilder: transition,
transitionDuration: const Duration(milliseconds: 600),
);
} else if (key == "fixed-trans") {
Application.router.navigateTo(
context, "/demo/fixedtrans?message=Hello!&color_hex=#f4424b");
} else {
message = "You tapped the function button!";
Application.router.navigateTo(context, "/demo/func?message=$message");

View File

@ -13,6 +13,7 @@ import './route_handlers.dart';
class Routes {
static String root = "/";
static String demoSimple = "/demo";
static String demoSimpleFixedTrans = "/demo/fixedtrans";
static String demoFunc = "/demo/func";
static String deepLink = "/message";
@ -23,6 +24,8 @@ class Routes {
});
router.define(root, handler: rootHandler);
router.define(demoSimple, handler: demoRouteHandler);
router.define(demoSimpleFixedTrans,
handler: demoRouteHandler, transitionType: TransitionType.inFromLeft);
router.define(demoFunc, handler: demoFunctionHandler);
router.define(deepLink, handler: deepLinkHandler);
}

View File

@ -34,7 +34,18 @@ typedef Widget HandlerFunc(
class AppRoute {
String route;
dynamic handler;
AppRoute(this.route, this.handler);
TransitionType transitionType;
AppRoute(this.route, this.handler, {this.transitionType});
}
enum TransitionType {
native,
nativeModal,
inFromLeft,
inFromRight,
inFromBottom,
fadeIn,
custom, // if using custom then you must also provide a transition
}
enum RouteMatchType {

View File

@ -13,16 +13,6 @@ import 'package:fluro/fluro.dart';
import 'package:fluro/src/common.dart';
import 'package:flutter/material.dart';
enum TransitionType {
native,
nativeModal,
inFromLeft,
inFromRight,
inFromBottom,
fadeIn,
custom, // if using custom then you must also provide a transition
}
class Router {
static final appRouter = new Router();
@ -32,10 +22,11 @@ class Router {
/// Generic handler for when a route has not been defined
Handler notFoundHandler;
/// Creates a [PageRoute] definition for the passed [RouteHandler]. You can optionally provide a custom
/// transition builder for the route.
void define(String routePath, {@required Handler handler}) {
_routeTree.addRoute(new AppRoute(routePath, handler));
/// Creates a [PageRoute] definition for the passed [RouteHandler]. You can optionally provide a default transition type.
void define(String routePath,
{@required Handler handler, TransitionType transitionType}) {
_routeTree.addRoute(
new AppRoute(routePath, handler, transitionType: transitionType));
}
/// Finds a defined [AppRoute] for the path value. If no [AppRoute] definition was found
@ -50,7 +41,7 @@ class Router {
Future navigateTo(BuildContext context, String path,
{bool replace = false,
bool clearStack = false,
TransitionType transition = TransitionType.native,
TransitionType transition,
Duration transitionDuration = const Duration(milliseconds: 250),
RouteTransitionsBuilder transitionBuilder}) {
RouteMatch routeMatch = matchRoute(context, path,
@ -112,6 +103,10 @@ class Router {
AppRouteMatch match = _routeTree.matchRoute(path);
AppRoute route = match?.route;
Handler handler = (route != null ? route.handler : notFoundHandler);
var transition = transitionType;
if (transitionType == null) {
transition = route != null ? route.transitionType : TransitionType.native;
}
if (route == null && notFoundHandler == null) {
return new RouteMatch(
matchType: RouteMatchType.noMatch,
@ -126,21 +121,21 @@ class Router {
RouteCreator creator =
(RouteSettings routeSettings, Map<String, List<String>> parameters) {
bool isNativeTransition = (transitionType == TransitionType.native ||
transitionType == TransitionType.nativeModal);
bool isNativeTransition = (transition == TransitionType.native ||
transition == TransitionType.nativeModal);
if (isNativeTransition) {
return new MaterialPageRoute<dynamic>(
settings: routeSettings,
fullscreenDialog: transitionType == TransitionType.nativeModal,
fullscreenDialog: transition == TransitionType.nativeModal,
builder: (BuildContext context) {
return handler.handlerFunc(context, parameters);
});
} else {
var routeTransitionsBuilder;
if (transitionType == TransitionType.custom) {
if (transition == TransitionType.custom) {
routeTransitionsBuilder = transitionsBuilder;
} else {
routeTransitionsBuilder = _standardTransitionsBuilder(transitionType);
routeTransitionsBuilder = _standardTransitionsBuilder(transition);
}
return new PageRouteBuilder<dynamic>(
settings: routeSettings,

View File

@ -72,4 +72,14 @@ void main() {
"number": ["7", "10", "13"],
}));
});
testWidgets("Router correctly matches route and transition type",
(WidgetTester tester) async {
String path = "/users/1234";
String route = "/users/:id";
Router router = new Router();
router.define(route,
handler: null, transitionType: TransitionType.inFromRight);
AppRouteMatch match = router.match(path);
expect(TransitionType.inFromRight, match.route.transitionType);
});
}