Flutter - Routing between different Views

4,932

Normal route navigation might look like this:

new IconButton(
    icon: new Icon(Icons.check),
    onPressed: () {
        Navigator.push(context, new MaterialPageRoute(
            builder: (_) => new MyCustomView(),
        );
    )
)

You can also use named routes by passing a map of WidgetBuilders as the routes constructor argument for your MaterialApp, or by passing an onGenerateRoute handler. There's an example of named routes in the Flutter gallery.

If you don't want there to be an animation, see my answer to this question.

Share:
4,932
OhMad
Author by

OhMad

Updated on December 02, 2022

Comments

  • OhMad
    OhMad over 1 year

    So, I have this file:

    import 'package:flutter/material.dart';
    import "calculateDerivations.dart";
    import "calculateRoots.dart";
    
    void main() {
      runApp(new MyApp());
    }
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return new MaterialApp(
          title: 'Flutter Demo',
          theme: new ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: new MyHomePage(title: 'Ableitungen berechnen'),
        );
      }
    }
    
    class MyHomePage extends StatefulWidget {
      MyHomePage({Key key, this.title}) : super(key: key);
    
      final String title;
    
      @override
      _MyHomePageState createState() => new _MyHomePageState();
    }
    
    class _MyHomePageState extends State<MyHomePage> {
    
      @override
      Widget build(BuildContext context) {
    
        return new Scaffold(
          appBar: new AppBar(title: new Text(config.title)),
          body: new Column(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              new InputWidget(),
            ]
          ),
        );
      }
    }
    
    class InputWidget extends StatefulWidget {
      @override
      InputWidgetState createState() => new InputWidgetState();
    }
    
    class InputWidgetState extends State<InputWidget> {
    
      InputValue val = new InputValue(text: "");
      String ersteAbleitung = "";
      String zweiteAbleitung = "";
      String dritteAbleitung = "";
      String roots = "";
      String function = "";
    
      void _submitted(){
        setState((){
          /*
           * Redirect here
           */
        });
      }
    
      @override
      Widget build(BuildContext context) {
    
        return new Column(
            children: [
              new Input(
                value: val,
                labelText: 'Funktion hier eingeben',
                onChanged: (InputValue newInputValue) {
                  setState(() {
                    val = newInputValue;
                  });
              }),
              new IconButton(
                icon: new Icon(Icons.check),
                onPressed: _submitted,
              )
            ]
        );
      }
    }
    

    As soon as the user now clicks the IconButton (which calls _submitted), I want him to be redirected to a new View (Widget). How would I solve this routing problem in Flutter?

    Thanks in advance