Flutter CallBack Function

2,662

You're calling your callback function in the wrong way inside your onTap callback. Change:

onTap: quantityCallBack('add'),

for

onTap: () => quantityCallBack('add'),

You can only pass a function the way you passed if they have the same type. In this case the onTap is void function() it doesn't have any arguments.

Also, your not passing the updated quantity value to your Text Widget

Share:
2,662
Amir
Author by

Amir

Updated on December 22, 2022

Comments

  • Amir
    Amir 11 months

    I have a quantity that needs to be updated in the parent widget. Quantity needs to be updated when pressing + or - Icon in the child widget. I passed the callback function the the child stateless widget, but it is not working. Instead I get an error saying setstate() or markneedsbuild() called during build.

    This is the parent widget

    class Wash extends StatefulWidget {
      @override
      _WashState createState() => _WashState();
    }
    
    class _WashState extends State<Wash> {
       int quantity = 0;
    
       void updateQuantity(command) {
         if (command == 'add') {
           setState(() {
            quantity++;
           });
         } else {
          setState(() {
           quantity--;
         });
        }  
       }
    
     @override
     Widget build(BuildContext context) {
       return Scaffold(
        body: OrderTile(
              imgPath: 'shorts',
              itemType: 'Shorts',
              quantityCallBack: updateQuantity,
            ),
       );
     }
    

    This is the child widget

    class OrderTile extends StatelessWidget {
    OrderTile({this.itemType, this.imgPath, this.quantityCallBack});
    
    final String imgPath;
    final String itemType;
    final Function quantityCallBack;
    
    @override
    Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.all(12.0),
      child: Row(
        children: <Widget>[
          Expanded(
            flex: 1,
            child: CircleAvatar(
              backgroundImage: AssetImage('images/${imgPath}.jpg'),
              radius: 30.0,
            ),
          ),
          Expanded(
            flex: 3,
            child: _Description(
              title: itemType,
            ),
          ),
          GestureDetector(
            onTap: quantityCallBack('add'),
            child: Icon(
              Icons.add,
              size: 24.0,
            ),
          ),
          SizedBox(
            width: 14,
          ),
          Text('1'),
          SizedBox(
            width: 14,
          ),
          GestureDetector(
            onTap: quantityCallBack('remove'),
            child: Icon(
              Icons.remove,
              size: 24.0,
            ),
          ),
        ],
      ),
    );
    }
    }
    

    Am I doing the right thing for the function call back implementation?