Flutter路由管理,使用fluro管理路由
2019-12-17 本文已影响0人
Leo丶Dicaprio
pubspec.yaml
添加fluro三方依赖
...
fluro: "^1.5.1"
...
执行flutter pub get
创建lib/route/routes.dart
文件,
...
class Routes{
static String root = "/"; //根目录
static String two = "/two"; //twopage路由path
//设置路由
static void configureRoutes(Router router){
//定义未找到页面
router.notFoundHandler = new Handler(
handlerFunc: (BuildContext context, Map<String, List<String>> params) {
print("ROUTE WAS NOT FOUND !!!");
return HomePage();
});
router.define(two,handler: twoPageHandler); //定义twoPage路由
}
}
创建lib/route/route_handles.dart
文件
...
//twoPage路由的handler
var twoPageHandler = Handler(
handlerFunc: (BuildContext context, Map<String, List<String>> parameters){
return TwoPage(); //返回的是TwoPage这个Widget
});
创建lib/utils/navigator_util.dart
文件
。。。
class NavigatorUtil {
static _navigateTo(BuildContext context, String path,{
bool replace = false,
bool clearStack = false,
Duration transitionDuration = const Duration(milliseconds: 250),
RouteTransitionsBuilder transitionBuilder}){
Application.router.navigateTo(context, path,
replace: replace, //替代,为true时调用的是Navigator.pushReplacement
clearStack: clearStack, //清空路由栈,为true时调用的是Navigator.pushAndRemoveUntil方法
transitionDuration: transitionDuration, //转换的持续时间
transitionBuilder: transitionBuilder, //转换生成器
transition: TransitionType.material, //转换类型
);
}
//路由导航到TwoPage页面
static goTwoPage(BuildContext context){
_navigateTo(context, Routes.two);
}
}
创建lib/application.dart
文件,
class Application{
static Router router; //静态化Router,这样我们在使用的时候就可以直接用 Application.Router就可以了。这样在任何一个页面都可以直接调用,不用再New 去调用了。
}
main()
方法中初始化路由
void main(){
Router router = Router();
Routes.configureRoutes(router);
Application.router = router;
runApp(MyApp());
}
使用
NavigatorUtil.goTwoPage(context);
就可以路由进入TwoPage页面
有新添加的路由,按照以下步骤操作
1:lib/route/routes.dart
中添加路由path和定义路由(router.define
)
2:lib/route/route_handles.dart
中定义路由的hander
3:lib/utils/navigator_util.dart
的NavigatorUtil
中添加路由导航页面
4:在需要的地方使用NavigatorUtil.新添加的路由导航
即可