有些文章吧,总是这个架构那个堆这个栈的,然后一堆不认识的英文缩写,说人话Please,拿起键盘就是干
标题通俗来说,就是原生与flutter 来回跳转的处理,想怎么跳就怎么跳
- 以iOS为例子,Native -> Flutter 肯定是 push 一个Flutter的controller, 那Android就是一个Activity喽
- 如果Flutter -> Flutter 就是还是在Flutter 的Controller 里, Native 的 导航栈不变, 解释成人话就是, navigation.viewControllers 的数量不变,顶部还是 FlutterViewController
- 如果Flutter -> iOS 这种情况,那就跟我们正常push 一个controller 一样喽, 栈数量 +1.
以上呢,基本就是处理Native 跟 Flutter 来回跳转的思路
知识点
- 我之前一直纠结这个Flutter 首页的问题 ('/'),就是这个路由,不设置怎么初始化?
因为我在 iOS 端设置了 initialRoute, 但是这个却不是跟视图,还能返回 ,我是真不知道!在initialRoute 跟 home 之间瞎操作了很多都没有用 ps : 以上全废话
- 我之前一直纠结这个Flutter 首页的问题 ('/'),就是这个路由,不设置怎么初始化?
- (1) 只设置initialRoute的话,路由一定要有’/’,’/‘为首页
- (2)initialRoute和home同时有的时候,使用initialRoute,路由里面可以没有’/’,返回最后返回到home,home是首页,
- (3)只有home时,路由可以没’/’,有不起作用。
- (4)home,initialRoute都没有,在路由onGenerateRoute中找’/’,
- (5)initialRoute、home、路由的’/'都没有时,error。
重点!! 在FlutterApp 中 我们只设置 home ,然后用路由来跳转
Start 开始我们的重点吧,说了一堆开始操作了
(一)auto_route 路由的 集成和怎么用
pubspec.yaml中添加 包括dev
dependencies:
flutter:
sdk: flutter
auto_route: ^0.3.1
dev_dependencies:
flutter_test:
sdk: flutter
auto_route_generator:
build_runner:
控制台:packages get
- 新建一个 MyRouter.dart 千万不要加 @initial 因为我们不需要生成'/'的路由
@CupertinoAutoRouter()
class $MyRouter {
//@initial
HomePage homePage;
MinePage minePage;
CategoryPage categoryPage;
}
控制台:flutter packages pub run build_runner build
build完之后就会生成一个MyRouter.gr.dart 这个时候我们的MyRouter类才有的
- 去你的App 下面注册路由
class MyApp extends StatelessWidget {
// This widget is the root of your application.
static MyNavigatorObserver navigatorObservers = MyNavigatorObserver();
@override
Widget build(BuildContext context) {
return CupertinoApp(
title: 'Home',
theme: CupertinoThemeData(
primaryColor: Colors.grey
),
navigatorObservers: [navigatorObservers],
onGenerateRoute: MyRouter.onGenerateRoute,
navigatorKey: MyRouter.navigator.key,
initialRoute: MyRouter.homePage,
);
}
- auto_route 使用
//跳转页面
//如果你页面有初始化参数(就是要接收的字段 ),MinePageArguments 就会生成这个类 当参数穿过去
MyRouter.navigator.pushNamed(MyRouter.minePage, arguments: MinePageArguments(name:"who")).then((value) {
print(value);
});
//退出页面
MyRouter.navigator.pop({"backContent":"123"});
其他的方法自己查去
------------------------------------------- 睡觉 ----------------------------------------