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:
- You can expose the created object as public member of your
State
. Then use thecurrentState
property of aGlobalKey
in oneState
to get a reference to the otherState
. Now you can access the created object via the public member. (Note: This pattern limits the testability and encapsulation of yourState
, so use it sparingly.) - Both widgets can have a ancestor widget that extends
InheritedWidget
that they use to look up the created object. - 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.
-
Add model to
SecondScreen
constructor:class SecondScreen extends StatefulWidget { final MyModel myModel; SecondScreen(MyModel myModel, {Key key}): super(key: key); ... }
-
Pass model when you construct
SecondScreen
in main.dartNavigator.push(context, new MaterialPageRoute(builder: (_) => new SecondScreen(model)));
Now you can access model in
_SecondScreenState
viawidget.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
);
}
}