CODEWITHSUNDEEP
classflutterdartwidget
wierdo
wierdo

Reputation: 285

How to reach a variable of a class from another class in Flutter

I have a stateful widget which includes buttons. I'm keeping number of user taps in an int variable called "counter".

I have another widget which is my home screen. I have a Text on that screen. I need to show the number of taps on this Text dynamically. So when user taps the button on the first class, my Text on the second class must be updated.

What is the best way to pass the counter variable from first widget to second widget?

Added some code

Both of my classes are stateful widgets. So, I declared static int counter like these;

class AppListView extends StatefulWidget {
  static int counter;

  @override
  _AppListViewState createState() => _AppListViewState();
}

Now I can reach counter from other class but can't reach from its own class. I mean I need to increase counter in that part but It says undefined.

class _AppListViewState extends State<AppListView> {
@override
  Widget build(BuildContext context) {
    return FlatButton(
           onPressed: (){
              counter++ (can't reach counter here)
      }

Upvotes: 9

Views: 34398

Answers (5)

Yunus G&#252;neş
Yunus G&#252;neş

Reputation: 1

I suggest one of the existing easy solutions to use a global library to share your application variables between classes : Create a dart file named globals.dart

globals.dart :
library YOUR_PACKAGE_NAME.globals;
int x = 1 ;



class1 :
import 'package:YOUR_PACKAGE_NAME/globals.dart' as globals;
print(globals.x) ; //prints 1 
globals.x= 2 ;  



class2 :
import 'package:YOUR_PACKAGE_NAME/globals.dart' as globals;
print(globals.x) ; //prints 2

https://devbrains.tn/forum/question/how-to-call-variables-from-different-class-in-flutter#6

Upvotes: 0

user2233706
user2233706

Reputation: 7197

You should use the provider package to associate the object with Provider, not any widget. Wrap the counter inside a class and pass it to MultiProvider:

void main() {
  runApp(
    MultiProvider(
      providers: [
        Provider(create: (context) => Something()),
      ],
      child: const MyApp(),
    ),
  );
}

And then you can access it from your build methods in each widget by:

var something = Provider.of<Something>(context, listen: false);
something.value++;

Upvotes: 1

Rafat Rashid Rahi
Rafat Rashid Rahi

Reputation: 629

Simple, in your code just write "widget.counter" in child. In statefull widget to access parent variable, you have to use "widget.instace". In this case, "widget.counter" will let u access counter variable of the parent.

  class AppListView extends StatefulWidget {
    int counter;

    @override
    _AppListViewState createState() => _AppListViewState();
  }

  class _AppListViewState extends State<AppListView> {
  @override
    Widget build(BuildContext context) {
      return FlatButton(
            onPressed: (){
                widget.counter++
        }

Note: u don't need counter variable to be static as u can call it with widget.counter in child class

Upvotes: 2

dangngocduc
dangngocduc

Reputation: 1814

Approach 1:

Create a ValueChanged from Parent Widget add pass to FirstWidget, when change couter -> call ValueChanged to send update to Parent Widget, Parent will update state for second Widget.

Approach 2:

Create a Stream from Parent Widget add pass to FirstWidget and Sencond Widget (using StreamBuilder to render widget). when change couter -> change value of Stream to update to Second Widget.

Update Demo:

Link DartPad

Upvotes: 2

Anakin Skywalker
Anakin Skywalker

Reputation: 41

You might want to make your desired variable static. 

class Something {
   static int counter; 
}

Then you can use the variable in the other widget like so:

class StatefulWidget{
   FlatButton(
    onPressed: (){
      Something.counter++; // This variable is your counter you mentioned earlier
   }
);
}

Upvotes: 3

Related Questions