Error: Expected ',' before this. validator: validate!(String value),

Question

Hello I'm getting this error in flutter:

lib/shared/components/components.dart:41:35: Error: Expected ',' before this.
      validator: validate!(String value),
                                  ^^^^^
lib/modules/login/login_screen.dart:36:33: Error: The argument type 'String? Function(String)' can't be assigned to the parameter type 'dynamic Function()?'.
                      validate: (String value){
                                ^
lib/shared/components/components.dart:41:35: Error: Getter not found: 'value'.
      validator: validate!(String value),
                                  ^^^^^
lib/shared/components/components.dart:41:27: Error: Too many positional arguments: 0 allowed, but 2 found.
Try removing the extra positional arguments.
      validator: validate!(String value),
                          ^


FAILURE: Build failed with an exception.

* Where:
Script 'C:\src\flutter\packages\flutter_tools\gradle\flutter.gradle' line: 1005

* What went wrong:
Execution failed for task ':app:compileFlutterBuildDebug'.
> Process 'command 'C:\src\flutter\bin\flutter.bat'' finished with non-zero exit value 1

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

components.dart code is:

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

Widget defaultButton(
    {double width = double.infinity,
      Color background = Colors.blue,
      double radius = 10.0,
      Function()? function,
      required String text,
      bool isUpperCase = true}) =>
    Container(
      height: 40.0,
      width: width,
      child: MaterialButton(
          onLongPress: () {},
          onPressed: function!() ,
          child: Text(
            isUpperCase ? text.toUpperCase() : text.toLowerCase(),
            style: TextStyle(color: Colors.white),
          )),
      decoration: BoxDecoration(
        borderRadius: BorderRadiusDirectional.circular(radius),
        color: background,
      ),
    );

Widget defaultFormFeild({
  required TextEditingController controller,
  required TextInputType type,
  void Function(String)? onSubmit,
  void Function(String)? onChange,
  required Function()? validate,
  required var label,
  required IconData prefix,
}) =>
    TextFormField(
      controller: controller,
      keyboardType: type,
      onFieldSubmitted: onSubmit, //do null checking
      onChanged: onChange, //do null checking
      validator: validate!(),
      decoration: InputDecoration(
          labelText: label,
          prefixIcon: Icon(prefix),
          border: OutlineInputBorder()
      ),
    );

login_screen.dart code:

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:udemy_flutter/shared/components/components.dart';
class LoginScreen extends StatelessWidget {
  var emailController = TextEditingController();
  var passController = TextEditingController();
  var formKey = GlobalKey<FormState>();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Padding(
        padding: const EdgeInsets.all(20.0),
        child: Center(
          child: SingleChildScrollView(
            child: Form(
              key: formKey,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  const Text(
                      'Login',
                    style: TextStyle(
                      fontSize: 40.0,
                      fontWeight: FontWeight.bold
                    ),
                  ),
                  const SizedBox(
                    height: 40.0,
                  ),
                  defaultFormFeild(
                      controller: emailController,
                      label: 'Email',
                      prefix: Icons.email,
                      type: TextInputType.emailAddress,
                      validate: (String value){
                        if(value.isEmpty != null){
                          return 'Email Cannot Be Empty';
                        }
                        return null;
                      }
                  ),
                  const SizedBox(
                    height: 15.0,
                  ),
                  TextFormField(
                    controller: passController,
                    obscureText: true,
                    keyboardType: TextInputType.visiblePassword,
                    decoration: const InputDecoration(
                      border: OutlineInputBorder(),
                      labelText: 'Password',
                      prefixIcon: Icon(
                        Icons.lock
                      ),
                      suffixIcon: Icon(
                        Icons.remove_red_eye,
                      )
                    ),
                    onChanged: (value) {
                      print(value);
                    },
                    onFieldSubmitted: (value) {
                      print(value);
                    },
                    validator: (value) {
                      if(value!.isEmpty){
                        return 'Password cannot be empty';
                      }
                      return null;
                    },
                  ),
                  const SizedBox(
                    height: 10.0,
                  ),
                  defaultButton(
                    function: (){
                      print(emailController.text);
                      print(passController.text);
                    },
                    text: 'Login',
                  ),
                  const SizedBox(
                    height: 10.0,
                  ),
                  defaultButton(
                    text: 'ReGister',
                    function: () {
                      print('You have just clicked on register');
                    },
                    background: Colors.red,
                    isUpperCase: false
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      const Text('Don\'t you have an account?'),
                      TextButton(onPressed: () {}, child: const Text(
                        'Register Now'
                      ))
                    ],
                  )
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

Can someone tell me where I am going wrong I'm new to the Flutter platform and I'm trying to build screens for various uses as I was having problems with Null safety and I managed to solve it, but I didn't know exactly what the problem with this code was

Solution

The TextFormField accepts FormFieldValidator? as a validator. The definition of the FormFieldValidator is:

typedef FormFieldValidator<T> = String? Function(T? value);

This doesn't match your definition of Function()? validator. You need to change your type to match the FormFieldValidator.

  void Function(String)? onChange,
  required Function()? validate,
  required var label,

will become

  void Function(String)? onChange,
  required String Function(String)? validate
  required var label,

Next, there is a second problem. You are executing this function before you assign it. It's unnecessary and causes type mismatch. In defaultFormFeild change the code to not execute the validator before passing it to the form field.

      onChanged: onChange, //do null checking
      validator: validate,
      decoration: InputDecoration(