antoprd
antoprd

Reputation: 403

Flutter: how to use Navigator PushNamed to send required parameters for Screen Constructor

I have a route map from which I call my screens in flutter. I need to pass three parameters to the constructor method of the next screen. I want to use the Navigator.pushNamed() but it doesn't seem to work when I use the arguments property.

//Screen to build 
class ResultPage extends StatelessWidget{
ResultPage(
  {@required this.calc1Result,
  @required this.calc2Text,
  @required this.interpretation});

  final String calc1Result;
  final String calc2Text;
  final String interpretation;

   @override
   Widget build(BuildContext context) {  //etc.. etc... }

  --------------------------------------------------------------------------

Then I need to call this screen from another page doing this:

  //Call to ResultPage from another screen
  Calculator calculator = Calculator(param1: param1, param2: param2);


   Navigator.pushNamed(context, 'resultPage', arguments: 
       {
       'calc1Result': calculator.getCalc1Result(),
       'calc2Text': calculator.getCalc2Text()
       'interpretation': calculator.getInterpretation(),           
       });

It doesn't work at all and the result is always Null.

While if I do the same thing using Navigator.push() it works.

//Working alternative - I don't want to use this:
Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => ResultPage(
                  calc1Result: calculator.getCalc1Result(),
                  calc2Text: calculator.getCalc2Text(),
                  interpretation: calculator.getInterpretation(),                      
                ),
              ),
            );

Upvotes: 2

Views: 8763

Answers (2)

KiriLL Sabko
KiriLL Sabko

Reputation: 358

I had the same trouble. I think you cannot use the constructor with Navigator.pushNamed().

So you send the data like arguments and then get them on another page by: Map arguments = ModalRoute.of(context)?.settings.arguments as Map;

Now you have a Map (Dictionary) and you can get the access by a key.

from your example:

 //Call to ResultPage from another screen
  Calculator calculator = Calculator(param1: param1, param2: param2);


   

    Navigator.pushNamed(context, 'resultPage', arguments: 
           {
           'calc1Result': calculator.getCalc1Result(),
           'calc2Text': calculator.getCalc2Text()
           'interpretation': calculator.getInterpretation(),           
           });

another screen:

class SecondPage extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
Map arguments = ModalRoute.of(context)?.settings.arguments as Map;
String someResult = arguments['calc1Result'];
    return Container(
child: Text(someResult),
);
  }
}

I hope it is helpful for someone...

Upvotes: 0

camillo777
camillo777

Reputation: 2367

Have you added the named routes to the MaterialApp widget?

MaterialApp(
  routes: {
    ExtractArgumentsScreen.routeName: (context) => ExtractArgumentsScreen(),
  },
);

See here: https://flutter.dev/docs/cookbook/navigation/navigate-with-arguments

Then in ResultPage you have to extract arguments with:

@override
  Widget build(BuildContext context) {
    // Extract the arguments from the current ModalRoute settings and cast
    // them as ScreenArguments.
    final args = ModalRoute.of(context).settings.arguments;

...
}

Upvotes: 1

Related Questions