Search code examples
flutterdartstatelesswidget

How to pass and receive data from a StatelessWidget to another?


As I started to learn flutter, I'm using my knowledge to create a basic calculator with this framework. I found a problem in my app... And that is: how to pass params and info from one widget to another? Specially from one Stateless widget to another. I've been looking in different places, but I don't understand how I can do it and how it works.

Thank you in advance to all of you that can explain me about it.

This is the code I'm working with:

class CalcStructure extends StatelessWidget {

  final List<String> rowOne = ['AC', 'Del', '%', '/'];
  final List<String> rowTwo = ['7', '8', '9', '*'];
  final List<String> rowThree = ['4', '5', '6', '-'];
  final List<String> rowFour = ['1', '2', '3', '+'];
  final List<String> rowFive = ['00', '0', '.', '='];

  @override
  Widget build(BuildContext context) {
    return Column(
        children: <Widget>[
          Container(
            width: MediaQuery.of(context).size.width,
            height: MediaQuery.of(context).size.height * 0.44,
            color: Colors.red,
          ),
          RowStructure(),
          RowStructure(),
          RowStructure(),
          RowStructure(),
          RowStructure(),         
        ],
      );
  }
}

And the class of RowStructure

class RowStructure extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Row(
            children: <Widget>[
              Container(
                child: FlatButton(
                  onPressed: () => print('Pressed'), 
                  child: Text('AC'),
                ),
                width: MediaQuery.of(context).size.width * 0.25,
                height: MediaQuery.of(context).size.height * 0.09,
              ),
              Container(
                child: FlatButton(
                  onPressed: () => print('Pressed'), 
                  child: Text('AC'),
                ),
                width: MediaQuery.of(context).size.width * 0.25,
                height: MediaQuery.of(context).size.height * 0.09,
              ),
              Container(
                child: FlatButton(
                  onPressed: () => print('Pressed'), 
                  child: Text('AC'),
                ),
                width: MediaQuery.of(context).size.width * 0.25,
                height: MediaQuery.of(context).size.height * 0.09,
              ),
              Container(
                child: FlatButton(
                  onPressed: () => print('Pressed'), 
                  child: Text('AC'),
                ),
                width: MediaQuery.of(context).size.width * 0.25,
                height: MediaQuery.of(context).size.height * 0.09,
              ),
            ],
          );
  }
}

The idea is to pass each of the lists (rowOne, rowTow...) as parameters to the other class, so I can re-use the code... Can you help me please?

Thank you


Solution

  • You simply pass data/value from one widget class to another through constructor:

    class RowStructure extends StatelessWidget {
      
      String text = "";
      VoidCallback onTap;
      
      RowStructure({ this.text, this.onTap });
      
      @override
      Widget build(BuildContext context) {
        return Row(
          children: <Widget>[
            Container(
              child: FlatButton(
                onPressed: onTap,
                child: Text(text),
              ),