App State, Data Passing in App Architecture - Flutter

By pjain      Published May 10, 2020, 11:18 p.m. in blog Programming   

App State

App Level Singletons

Data Passing between Pages

DATA Ex: Passing data page1>Pg2

- HmPg ____<go> -> material PgRoute pass data-> NxtPg show data
    - Construct a text field on the first page
    - Pass the text from the field to the next page
    - Use a text controller to get the fields value
    - Use a material page route to pass the data


    import 'package:flutter/material.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(),
        );
      }
    }

    class MyHomePage extends StatefulWidget {
      @override _MyHomePageState createState() => new _MyHomePageState();
    }
    class _MyHomePageState extends State<MyHomePage> {
      var _textController = new TextEditingController();
      @override Widget build(BuildContext context) {
        return new Scaffold(
          appBar: new AppBar(title: new Text("Home Page"), ),
          body: new ListView(
            children: <Widget>[
              new ListTile(
                title: new TextField(controller: _textController, ),
              ),
              new ListTile(
                title: new RaisedButton(
                  child: new Text("Next"),
                  onPressed: () {
                    var route = new MaterialPageRoute(
                      builder: (BuildContext context) =>
                          new NextPage(value: _textController.text),
                    );
                    Navigator.of(context).push(route);
                  },
                ),
              ),
            ],
          ),
        );
      }
    }

    class NextPage extends StatefulWidget {
      final String value;
      NextPage({Key key, this.value}) : super(key: key);
      @override _NextPageState createState() => new _NextPageState(); 
    }
    class _NextPageState extends State<NextPage> {
      @override Widget build(BuildContext context) {
        return new Scaffold(
          appBar: new AppBar(title: new Text("Next Page"), ),
          body: new Text("${widget.value}"),
        );
      }
    }

DATA: Extract Arguments passed in

To Extract the arguments (data) you call the ModalRoute.of(context).settings.arguments and for this example you access the data by calling the arguments variable key value.

    // Extract Arguments from navigated page
    class _DetailsState extends State<Details> {
      Map arguments = Map(); //Map<String,?dynamic?>
      @override void didChangeDependencies() { //use to fetch arguments passed in 
        super.didChangeDependencies();
        arguments = ModalRoute.of(context).settings.arguments;
      }
      @override Widget build(BuildContext context) {
          return Scaffold(
           body: Text(arguments['emotion']),
          );
      }
    }

EX: Passing data Stateful

  • To stateful
    // From main

    MaterialApp/Scaffold/body: 
        CardsManager("Sample String to pass"),

    // To stateful
    class CardManager ext StatefulWidget {
            final String basicCard;
        CardManager(this.basicCard);

        @override State<StatefulWidget> createState {
            return CardManagerState(basicCard);
        }
    }
    class CardManagerState extends State<CardsManager> {
        List<String> cardy = [];
        @override initState() {
            cardy.add(widget.basicCard);
            super.initState(); 
        }
        @override Widget build(BuildContext context) {

        }
    }

0 comments

There are no comments yet

Add new comment

Similar posts

List++ Advanced Application Features

Interview Questions in Flutter

NAV: URL Launcher, Deep Links

NAV: Navigation Drawers