web-dev-qa-db-fra.com

Flutter Navigator ne fonctionne pas

J'ai une application avec deux écrans et je veux faire appuyer du 1er au deuxième écran en appuyant sur le bouton.

Ecran 1 

import 'package:flutter/material.Dart';
import './view/second_page.Dart';

void main() => runApp(new MyApp());

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new MainScreen();
  }
}

class MainScreen extends State<MyApp> {

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        home: new Scaffold(
            appBar: new AppBar(
                title: new Text("Title")
            ),
            body: new Center(
                child: new FlatButton(child: new Text("Second page"),
                    onPressed: () {
                      Navigator.Push(context,
                          new MaterialPageRoute(
                              builder: (context) => new SecondPage()))
                    }
                )
            )
        )
    );
  }
}

Ecran 2 

import 'package:flutter/material.Dart';

class SecondPage extends StatefulWidget {

  @override
  State<StatefulWidget> createState() {
    return new SecondPageState();
  }
}


class SecondPageState extends State<SecondPage> {

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Title"),
      ),
      body: new Center(
        child: new Text("Some text"),
      ),
    );
  }
}

Pousser ne se passe pas et j'ai ce

L'assertion suivante a été émise lors de la manipulation d'un geste: Navigator opération demandée avec un contexte n'incluant pas de navigateur . Le contexte utilisé pour pousser ou extraire des routes à partir du navigateur doit être celui d'un widget qui est un descendant d'un widget Navigator.

Une autre exception a été levée: opération Navigator demandée avec un contexte qui n'inclut pas un navigateur.

Qu'est-ce qui ne va pas?

dartflutter
5
moonvader

Pensez aux widgets de Flutter comme à un arbre, le contexte pointant sur le nœud en cours de construction avec la fonction de construction. Dans votre cas, vous avez

MainScreen    <------ context
  --> MaterialApp
   (--> Navigator built within MaterialApp)
      --> Scaffold
        --> App Bar
          --> ...
        --> Center
          --> FlatButton

Ainsi, lorsque vous utilisez le contexte pour rechercher le navigateur, vous utilisez un contexte pour l'écran principal qui ne se trouve pas sous le navigateur.

Vous pouvez créer une nouvelle sous-classe Widget Stateless ou Stateful pour qu'elle contienne votre Center + FlatButton, car la fonction de construction de ces fonctions pointe à ce niveau ou vous pouvez utiliser un Builder et définir le callback builder (qui a un contexte pointant vers le générateur) pour renvoyer le bouton central + le bouton plat.

8
rmtmckenzie

L'itinéraire ne peut pas être trouvé pour deux raisons principales.

1) La route est définie en dessous du contexte transmis à Navigator.of (context) - scénario expliqué par @rmtmackenzie

2) La route est définie sur la branche jumelle par ex. 

Root 

  -> Content (Routes e.g. Home/Profile/Basket/Search)

  -> Navigation (we want to dispatch from here)

Si nous voulons envoyer un itinéraire à partir du widget Navigation, nous devons connaître la référence à NavigatorState. Avoir une référence globale coûte cher, surtout si vous avez l'intention de déplacer le widget dans l'arborescence. https://docs.flutter.io/flutter/widgets/GlobalKey-class.html . Utilisez-le uniquement lorsqu'il n'y a aucun moyen de l'obtenir à partir de Navigator.of (context).

Pour utiliser une clé globale dans MaterialApp, définissez navigatorKey.

final navigatorKey = GlobalKey<NavigatorState>();

Widget build(BuildContext context) => MaterialApp {
    navigatorKey: navigatorKey
    onGenerateRoute : .....
};

Maintenant, n'importe où dans l'application où vous passez la clé navigatorKey, vous pouvez maintenant invoquer

navigatorKey.currentState.Push(....);

Vient de poster à ce sujet https://medium.com/@swav.kulinski/flutter-navigating-off-the-charts-e118562a36a5

2
robotoaster

il suffit de faire la classe MaterialApp dans la méthode principale comme dans cet exemple 

 void main() => runApp(MaterialApp(home: FooClass(),));

cela fonctionne bien pour moi, J'espère que cela fonctionnera

1
YahYa