Velvet Star Monitor

Standout celebrity highlights with iconic style.

general

Using Type Function and pass it into ElevatedButton onPressed, Flutter

Writer 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;

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password

Post as a guest

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.