how to access an object created in one stateful widget in another stateful widget in flutter

There are lots of ways to do this depending on your use case. Here are a few options:

  1. You can expose the created object as public member of your State. Then use the currentState property of a GlobalKey in one State to get a reference to the other State. Now you can access the created object via the public member. (Note: This pattern limits the testability and encapsulation of your State, so use it sparingly.)
  2. Both widgets can have a ancestor widget that extends InheritedWidget that they use to look up the created object.
  3. Both widgets can be passed a model argument in their a constructor, such as a ValueNotifier. They can use this object to read and write the value.

If you go into more detail on your use case we can help you pick a pattern that makes sense.

Here is some code implementing option #1.

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

final key = new GlobalKey<MyStatefulWidget1State>();

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        body: new Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            new MyStatefulWidget1(key: key),
            new MyStatefulWidget2(),
          ],
        ),
      ),
    );
  }
}

class MyStatefulWidget1 extends StatefulWidget {
  MyStatefulWidget1({ Key key }) : super(key: key);
  State createState() => new MyStatefulWidget1State();
}

class MyStatefulWidget1State extends State<MyStatefulWidget1> {
  String _createdObject = "Hello world!";
  String get createdObject => _createdObject;

  @override
  Widget build(BuildContext context) {
    return new Center(
      child: new Text(_createdObject),
    );
  }
}

class MyStatefulWidget2 extends StatefulWidget {
  State createState() => new MyStatefulWidget2State();
}

class MyStatefulWidget2State extends State<MyStatefulWidget2> {
  String _text = 'PRESS ME';

  @override
  Widget build(BuildContext context) {
    return new Center(
      child: new RaisedButton(
        child: new Text(_text),
        onPressed: () {
          setState(() {
            _text = key.currentState.createdObject;
          });
        },
      ),
    );
  }
}

You can pass the model when you construct SecondScreen widget.

  1. Add model to SecondScreen constructor:

    class SecondScreen extends StatefulWidget {
      final MyModel myModel;
    
      SecondScreen(MyModel myModel, {Key key}):
          super(key: key);
    ...
    }
    
  2. Pass model when you construct SecondScreen in main.dart

    Navigator.push(context, new MaterialPageRoute(builder: (_) => 
      new SecondScreen(model)));
    
  3. Now you can access model in _SecondScreenState via widget.myModel


Here is how I pass parameter to the child widget.

First Widget dart file

class FirstWidget extends StatefulWidget {
    _FirstWidgetState createState() => _FirstWidgetState() 
}

class _FirstWidgetState extends State<FirstWidget> {
    String param = "My parameter";
    @override
    Widget build(BuildContext context) {
        return Container(
                    child: 
                        SecondWidget(param), //pass parmater here
                );
    }
}

Second Widget dart file

class SecondWidget extends StatefulWidget {
    final String param; 
    SecondWidget(this.param); //passed paramter
    _SecondWidgetState createState() => _SecondWidgetState() 
}

class _SecondWidgetState extends State<SecondWidget> {
    @override
    Widget build(BuildContext context) {
        return Container(
                    child: 
                        Text(widget.param), //output paramter
                );
    }
}

Tags:

Dart

Flutter