The argument type 'Function' can't be assigned to the parameter type 'void Function(bool?)?'

Question

I am trying to pass a function using constructor arguments but it shows me the error mentioned in the title.

import 'package:flutter/material.dart';

class TaskTile extends StatefulWidget {
  @override
  _TaskTileState createState() => _TaskTileState();
}

class _TaskTileState extends State<TaskTile> {
  bool isChecked = false;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text(
        'This is a task',
        style: TextStyle(
          decoration: isChecked ? TextDecoration.lineThrough : null,
        ),
      ),
      trailing: TaskCheckbox(
        checkboxState: isChecked,
        toggleCheckboxState: (bool checkboxState) {
          setState(() {
            isChecked = checkboxState;
          });
        },
      ),
    );
  }
}

class TaskCheckbox extends StatelessWidget {
  final bool checkboxState;
  final Function toggleCheckboxState;

  TaskCheckbox(
      {required this.checkboxState, required this.toggleCheckboxState});

  @override
  Widget build(BuildContext context) {
    return Checkbox(
      activeColor: Colors.lightBlueAccent,
      value: checkboxState,
      onChanged: toggleCheckboxState,
    );
  }
}

I searched the web for this but no luck over there.

so if anybody could help me out would me much appriciated.

Answer 1

Your final Function toggleCheckboxState; needs to have a bool? parameter.

Try like this:

final Function(bool?) toggleCheckboxState;

You also need to change the code while assigning toggleCheckboxState like this,

toggleCheckboxState: (bool? checkboxState) {
  setState(() {
    isChecked = checkboxState!;
  });
},

bool? checkboxState would be required here since your type is Function(bool?)

Answer 2

Faced the same issue, below is an example of code I like using. For more information check the documentation: Checkbox class

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: const Text(_title)),
        body: const Center(
          child: MyStatefulWidget(),
        ),
      ),
    );
  }
}

class MyStatefulWidget extends StatefulWidget {
  const MyStatefulWidget({Key? key}) : super(key: key);

  @override
  State<MyStatefulWidget> createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  bool isChecked = false;

  @override
  Widget build(BuildContext context) {
    Color getColor(Set<MaterialState> states) {
      const Set<MaterialState> interactiveStates = <MaterialState>{
        MaterialState.pressed,
        MaterialState.hovered,
        MaterialState.focused,
      };
      if (states.any(interactiveStates.contains)) {
        return Colors.blue;
      }
      return Colors.red;
    }

    return Checkbox(
      checkColor: Colors.white,
      fillColor: MaterialStateProperty.resolveWith(getColor),
      value: isChecked,
      onChanged: (bool? value) {
        setState(() {
          isChecked = value!;
        });
      },
    );
  }
}

Answer 3

'I am convinced that you were looking at the course of Anjela Yu and me too I found the solution'@the keyword is down-casting about null safety

import 'package:flutter/material.dart';

class TaskTile extends StatefulWidget {
  @override
  _TaskTileState createState() => _TaskTileState();
}

class _TaskTileState extends State<TaskTile> {
  bool isChecked = false;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text(
        'This is a task',
        style: TextStyle(
          decoration: isChecked ? TextDecoration.lineThrough : null,
        ),
      ),
      trailing: TaskCheckbox(
        checkboxState: isChecked,
        toggleCheckboxState: (bool? checkboxState) {
          setState(() {
            isChecked = checkboxState!;
          });
        },
      ),
    );
  }
}

class TaskCheckbox extends StatelessWidget {
  final bool checkboxState;
  final Function? toggleCheckboxState;

  TaskCheckbox(
      {required this.checkboxState, required this.toggleCheckboxState});

  @override
  Widget build(BuildContext context) {
    return Checkbox(
      activeColor: Colors.lightBlueAccent,
      value: checkboxState,
      onChanged: toggleCheckboxState as void Function(bool?)?
    );
  }
}

Answer 4

`import 'dart:ui';
 import 'package:flutter/material.dart';

 class TaskTile extends StatefulWidget {
  @override
   _TaskTileState createState() => _TaskTileState();
     } 

class _TaskTileState extends State<TaskTile> {
bool isChecked = false;
checkBoxCallback(bool checkBoxState) {
    setState(() {
      isChecked = checkBoxState;
      });
 }

 @override
 Widget build(BuildContext context) {
    return ListTile(
     title: Text(
      "Complete Assignments",
       style: TextStyle(
        decoration: isChecked ? TextDecoration.lineThrough : null,
       fontSize: 20,
     ),
   ),
   trailing: TaskCheckbox(
       checkBoxState: isChecked, toggleCheckBoxState: checkBoxCallback), );
    }
  }

  class TaskCheckbox extends StatelessWidget {
  final bool checkBoxState;
  final Function toggleCheckBoxState;

  const TaskCheckbox(
   {Key? key,
  required this.checkBoxState,
  required this.toggleCheckBoxState})
  : super(key: key);

@override
Widget build(BuildContext context) {
  return Checkbox(
    activeColor: Colors.blue,
    value: checkBoxState,
    onChanged: (newValue) {
      toggleCheckBoxState(newValue);
    });
  }
 }