How to realize context free jump in fluent

Background introduction

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

In daily project development, we generally use the above method to push a new page, using navigator. Of (context) to push or pop.

Disadvantages: in this case, the context must be passed. The purpose is to use navigator. Of (context) to obtain the navigator state object, and then push or pop operations can be carried out.

If I want to push a new page anywhere in the project, and this place may not get context, so I need to realize context free jump at this time.

Solution

The essence of context free jump is that it is unnecessary for us to pass the context parameter every time, and then use some operations to directly obtain the current navigator state.

Scenario 1: using globalkey

Here post the relevant source code. You can see the source code yourself.

Materialapp class:

Widgetsapp class: it can be seen that the navigator key defined by us is finally the key value that will be passed to the navigator, so we can obtain the navigatorstate object here through the key. Currentstate() method.

class _WidgetsAppState extends State<WidgetsApp> implements WidgetsBindingObserver {

 GlobalKey<NavigatorState> _navigator;

 void _updateNavigator() {
 _navigator = widget.navigatorKey ?? GlobalObjectKey<NavigatorState>(this);
 }

 @override
 Widget build(BuildContext context) {
 Widget navigator;
 if (_navigator != null) {
  navigator = Navigator(
  key: _navigator,initialRoute: WidgetsBinding.instance.window.defaultRouteName != Navigator.defaultRouteName
   ? WidgetsBinding.instance.window.defaultRouteName
   : widget.initialRoute ?? WidgetsBinding.instance.window.defaultRouteName,onGenerateRoute: _onGenerateRoute,onUnkNownRoute: _onUnkNownRoute,observers: widget.navigatorObservers,);
 }
}

Simple code implementation

1. Define a globalkey < navigatorstate > object

 static GlobalKey<NavigatorState> navigatorKey=GlobalKey();

2. When creating the object of materialapp, assign the navigator key to materialapp.

MaterialApp(
   navigatorKey: Router.navigatorKey,)

Use globalkey to get the navigatorstate object anywhere

navigatorKey.currentState.pushNamed("/login");

Scenario 2: using navigator observer

Note: a navigatorstate object navigator is defined in the navigatorobserver, so we can customize the navigatorobserver and directly use this Navigator object to do page push or pop operations. In this way, we don't need to use context to obtain the navigatorstate object.

The materialapp class provides the navigatorobservers property, so that we can customize the navigatorobserver to listen to changes in the navigator.

The navigatorstate class, when executing the inststate object, will assign itself to all observer objects listening_ Inside the navigator.

Simple code implementation

1. Customize the navigator observer.

class CustomNavigatorObserver extends NavigatorObserver{
 static CustomNavigatorObserver _instance;

 static CustomNavigatorObserver getInstance() {
 if (_instance == null) {
  _instance = CustomNavigatorObserver();
 }
 return _instance;
 }
}

2. When creating a materialapp object, assign customnavigatorobserver to materialapp

MaterialApp(
   navigatorObservers: [CustomNavigatorObserver()],)

3. Use customnavigatorobserver to operate the page anywhere

CustomNavigatorObserver.getInstance().navigator.pushNamed("/login");

summary

The above is the whole content of this article. I hope the content of this article has a certain reference value for your study or work. Thank you for your support.