Flutter 路由管理

Flutter的路由状态管理依赖navigator类。
可以在点击事件里进行路由的跳转,例如:

Navigator.of(context).push(
  MaterialPageRoute(builder: (context) {
              return NewRoute();
   }));
)

或
Navigator.push(context,
  MaterialPageRoute(builder: (context) {
              return NewRoute();
   }));
)

这样就可以跳转到NewRoute页面,返回上一个页面可以用pop方法。
MaterialPageRoute继承自PageRoute类,PageRoute类是Flutter的一个抽象类,是占有整个屏幕空间的一个模态路由页面,内部包含了路由构建及切换时过渡动画的相关接口及属性。
MaterialPageRoute类的参数如下:

 MaterialPageRoute({
    WidgetBuilder builder,
    RouteSettings settings,
    bool maintainState = true,
    bool fullscreenDialog = false,
  })

使用push方法传递参数就是直接从构造函数传递;
pop(context, [result])方法:返回上一页,result为返回时传递给上个页面的数据。
接收pop数据的方式:

var result = await Navigator.push(
        context,
            MaterialPageRoute(
              builder: (context) {
                return TipRoute(
                  // 路由参数
                  text: "我是提示xxxx",
                );
              },
            ),
          );
          //输出`TipRoute`路由返回结果
          print("路由返回值: $result");

也就是直接Future拿数据。

命名路由:

在MaterailApp构造函数中配置:

MaterialApp(
  title: 'Flutter Demo',
  theme: ThemeData(
    primarySwatch: Colors.blue,
  ),
  //命名路由注册的地方
  routes:{
   "page1":(context)=>Page1(),
    // ... 
  } ,
  home: MyHomePage(title: 'Home Page'),
);

使用这种方式注册的路由在跳转时可以用Navigator的pushName方法:
Future pushNamed(BuildContext context, String routeName,{Object arguments});

获取命名路由传递的参数的方法:

class ChildRoute extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    //获取路由参数  
    var args=ModalRoute.of(context).settings.arguments
    //...
  }
}
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容