Click button in child widget not detected in parent function - flutter

Question

I am trying to understand how state works with Flutter, I have a child widget that needs to change something in the Parent widget. I can detect the push on the button in the child using a print. However when i try to bubble up this change to the parent its not catching it.
I have been though a number of tutorials and im not 100% sure I understand how state works or should work, I think I am missing something here.
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
//Consider this function as your _onNotification and important to note I am using setState() within :)
void _incrementCounter() {
print("pressed"); // Does not detect pressed.
setState(() {
_counter++; // counter is not increased
});
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
widget.title,
style: TextStyle(color: Colors.white),
),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You have pushed the button $_counter times:',
style: TextStyle(fontSize: 20.0, fontWeight: FontWeight.bold),
),
],
),
),
floatingActionButton: MyFloatButton(
_incrementCounter), //Pass delegate to _incrementCounter method
);
}
}
class MyFloatButton extends StatefulWidget {
// Here I am receiving the function in constructor as params
const MyFloatButton(this.onPressedFunction, {super.key});
// Should be the delegated function from _MyHomePageState
final Function onPressedFunction;
#override
_MyFloatButtonState createState() => new _MyFloatButtonState();
}
class _MyFloatButtonState extends State<MyFloatButton> {
#override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.all(5.0),
decoration: BoxDecoration(
color: Colors.orangeAccent,
borderRadius: new BorderRadius.circular(50.0)),
child: IconButton(
icon: Icon(Icons.add),
color: Colors.white,
onPressed: () => {
//print('pressed') // Does work shows button pressed
widget.onPressedFunction
}, // call the delegated method to detect the pressed
),
);
}
}
Things tried:
onPressed: widget.onPressedFunction()
Results in
setState() or markNeedsBuild called during build
onPressed: widget.onPressedFunction
Results in
The argument type 'Function' can't be assigned to the parameter type 'void Function()?'.
onPressed: () => widget.onPressedFunction,
Results in
No change does not do anything

Answer 1

Please try this. onPressedFunction is a function so declare like below function.
onPressed: () => {
widget.onPressedFunction()
},

Answer 2

Inside the MyFloatButton you're calling a function inside a function
onPressed: () => {
//print('pressed') // Does work shows button pressed
widget.onPressedFunction
},
It should be as follows
onPressed: widget.onPressedFunction

Answer 3

Change this
onPressed: () => {
//print('pressed') // Does work shows button pressed
widget.onPressedFunction
},
To this
onPressed: () => widget.onPressedFunction,
Just remove curly braces and add () here
floatingActionButton: MyFloatButton(
_incrementCounter())