How to pass callback in Flutter

Question

Code will explain all:

    class ResultOverlay extends StatefulWidget {
    
      final bool _isCorrect;
      VoidCallback _onTap;
    
      ResultOverlay(this._isCorrect, this._onTap);
      ......
      ......
}

Its state class:

class ResultOverlayState extends State<ResultOverlay>{
@override
  Widget build(BuildContext context) {
    ........
      child: new InkWell(
        onTap: () => widget._onTap,
.....
.....
}

Passing of callback function:

new ResultOverlay(isCorrect, () {
                        () => CallAnswerPage();
                      })

What I am missing here?

Machellemachete

Answer 1

I was not passing the callback correctly. Here is the correct syntax:

new ResultOverlay(
    isCorrect, 
    () => callAnswerPage()
)

So silly mistake :)

Machellemachete

Answer 2

This is a more general answer for future viewers.

Callback types

There are a few different types of predefined callbacks:

final VoidCallback myVoidCallback = () {};
final ValueGetter<int> myValueGetter = () => 42;
final ValueSetter<int> myValueSetter = (value) {};
final ValueChanged<int> myValueSetter = (value) {};

Notes:

• VoidCallback is an anonymous function that takes no arguments and returns no value.
• ValueGetter is an anonymous function that returns a value, which you provide for someone who wants to get it.
• ValueSetter is an anonymous function that takes a value as an argument, which you can use to set some other value.
• ValueChanged has the same function signature and is used the same way as ValueSetter, but its name emphasizes that the given value actually changed (and was not just set with the same value again).

See this answer for more details.

Ways to write the callback

Good

When you are asked to provide a callback to an API, you can directly write the callback:

onPressed: () {},

Or you can supply the callback variable name (without parentheses):

onPressed: myVoidCallback,

Less good

It would be unnecessarily verbose to use both forms (but you could if you included the parentheses after the variable name):

onPressed: () {
  myVoidCallback();
},

This one is equivalent (but also unnecessarily verbose):

onPressed: () => myVoidCallback(),

Just use one of the "Good" forms from above.

Still good

The exception would be if you wanted to do something like call a value setter when the parameter is only asking for a void callback:

onPressed: () => myValueSetter(42),

Rockafellow

Answer 3

Everything is fine beside how you use it.

Change

    onTap: () => widget._onTap,

to

    onTap: widget._onTap,

inside your State class

Crissy

Answer 4

onTap: () => widget._onTap,

as ontap needs function '()=>' itself is a function, So it will be onTap:widget._onTap,

and if you want to use in stateless widget ontap:_ontap

Abernethy

Answer 5

As the name suggests,VoidCallback listens for click events.here is below example.

 ResultOverlay(true, _requestPermission);
                  ResultOverlay(_isCorrect, () {
                    print('I am a voidCallback');
                  });

or

 ResultOverlay(true, _requestPermission);
                      ResultOverlay(_isCorrect, myVoidCallback());

ResultOverlay

class ResultOverlay extends StatefulWidget {
  final bool _isCorrect;
  VoidCallback _onTap;

  ResultOverlay(this._isCorrect, this._onTap);

  @override
  State<ResultOverlay> createState() => _ResultOverlayState();
}

class _ResultOverlayState extends State<ResultOverlay> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: InkWell(
        onTap: widget._onTap,
      ),
    );
  }
}

Calc