Using Type Function and pass it into ElevatedButton onPressed, Flutter
Matthew Barrera
I am new to Flutter + Dart. I basically have class in the following. First I have a clas called BottomForm where it have build function that returns ElevatedButton problem when I call Function type variable in onPressed I have an issue saying that: The argument type 'Function' can't be assigned to the parameter type 'void Function()?'.dartargument_type_not_assignable
import 'formbutton.dart';
// Define a corresponding State class.
// This class holds the data related to the Form.
class _MyCustomFormState extends State<MyCustomForm> { // Create a text controller and use it to retrieve the current value // of the TextField. final email = TextEditingController(); final password = TextEditingController(); void _logIn() { print("Logged In."); } @override void dispose() { // Clean up the controller when the widget is disposed. email.dispose(); password.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return Scaffold( body: Column( children: [ Padding( padding: const EdgeInsets.all(16.0), child: TextFormField( autocorrect: true, controller: email, ), ), ButtonForm(_logIn, "Hello"), ], ), floatingActionButton: FloatingActionButton( onPressed: () { showDialog( context: context, builder: (context) { return AlertDialog( content: Text(email.text), ); }); }, tooltip: "Show me the value", child: Icon(Icons.text_fields), ), ); }
}
//Define a Custom Widget
class MyCustomForm extends StatefulWidget { @override _MyCustomFormState createState() => _MyCustomFormState();
}Than I have a problem in the main class for our Button . When I pass the Function functionApply;
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class ButtonForm extends StatelessWidget { final Function functionApply; final String textButton; ButtonForm(this.functionApply, this.textButton); @override Widget build(BuildContext context) { return Container( width: double.infinity, child: ElevatedButton( child: Text(this.textButton), onPressed: this.functionApply, // I have a problem here!! ), ); }
} 3 Answers
onPressed is a type of VoidCallback
typedef VoidCallback = void Function()So instead of using
final Function functionApply;use
final VoidCallback functionApply;So your ButtonForm will be
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class ButtonForm extends StatelessWidget { final VoidCallback functionApply; final String textButton; ButtonForm(this.functionApply, this.textButton); @override Widget build(BuildContext context) { return Container( width: double.infinity, child: ElevatedButton( child: Text(textButton), onPressed: functionApply, // Problem Solved!! ), ); }
} Try this:
ElevatedButton( child: Text(this.textButton), onPressed: () { functionApply(); },
) 0 Give the return type of your function. If you don't give any return type then by default the return type will be dynamic. But onPressed function 's return type is void. So just change the function deceleration and it will work nicely.
final void Function() functionApply;