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

Viewed 8876

the problem is the header . Im trying to build the todoye app and as you can see the call back is considered ValueChanged<bool?> not a simple function so i cant move my logic to a another statefullwidget to reduce the rebuilds in my app i tried different things but i get error evertime please help . here is my code :

import 'package:flutter/material.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text(
        'finish up angla\'s course today',
        style: TextStyle(
          decoration: isChecked ? TextDecoration.lineThrough : null,
        ),
      ),
      trailing: TaskCheckBox(
        checkBoxState: isChecked,
        toggleCheckBoxState: checkBoxCallBack,
      ),
    );
  }
}

class TaskCheckBox extends StatelessWidget {
  final bool checkBoxState;
  final ValueChanged<bool?> toggleCheckBoxState;

  const TaskCheckBox({
    required this.checkBoxState,
    required this.toggleCheckBoxState,
  });

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

the error is on line 27 ...where i want to pass my custom Function to varaible of my statelessWidget.

6 Answers

This is happening because you have declared your toggleCheckBoxState as final ValueChanged<bool?> toggleCheckBoxState;, and bool data type is not same as bool? data type. bool? is a nullable boolean type. To fix it, change the method checkBoxCallback to the following

void checkBoxCallBack(bool? checkBoxState) {
    if (checkBoxState != null) {
      setState(() {
        isChecked = checkBoxState;
      });
    }
  }

I hit the same issue and eventually I got this working

import 'package:flutter/material.dart';

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

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

  void checkboxCallBack(bool? checkboxState) {
    setState(() {
      isChecked = checkboxState ?? true;
    });
  }

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text(
        'Task 1',
        style: TextStyle(
            decoration:
                isChecked ? TextDecoration.lineThrough : TextDecoration.none),
      ),
      trailing: TaskCheckbox(isChecked, checkboxCallBack),
    );
  }
}

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

  TaskCheckbox(this.checkboxState, this.toggleCheckboxState);

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

Changing this function like this

void checkboxCallBack(bool? checkboxState) {
    setState(() {
      isChecked = checkboxState ?? true;
    });
  }

and toggleCheckbox variable to:

final Function(bool?) toggleCheckboxState;

I've faced the same issue, and when I tried to update the method checkboxCallback

To this:

void checkBoxCallBack(bool? checkBoxState) {
    if (checkBoxState != null) {
      setState(() {
        isChecked = checkBoxState;
      });
    }
  }

I still got the error, but when I tried to update the onChanged:property of Checkbox

Into this:

onChanged: toggleCheckboxState as void Function(bool?)?,

I don't know why or how, but it get the job done.

Updated code:

import 'package:flutter/material.dart';

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

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

  void checkBoxCallBack(bool? checkBoxState) {
    if (checkBoxState != null) {
      setState(() {
        isChecked = checkBoxState;
      });
    }
  }

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

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?)?,
    );
  }
}

i also encounter this problem, this is how i solved it, i updated the checkboxcallback function as shown below,

void checkboxCallBack(bool? checkboxState) {
setState(() {
  isChecked = checkboxState!;
});

}

then on theTaskCheckbox class, i change the declaration of the togglecheckboxState function as ;

final void Function(bool?) toggleCheckboxState;

and boom everything is working perfectly

// try this

Checkbox(
          value: isChecked,
          onChanged: (v){
            checkBoxCallBack();
          },

      ),

This works for me:

import 'package:flutter/material.dart';

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

  @override
  State<TaskTile> createState() => _TaskTileState();
}

class _TaskTileState extends State<TaskTile> {
  // Property to determine whether checkbox is checked at the moment
  bool isChecked = false;

  // Function is called whenever a checkbox is toggled
  void checkboxCallback(bool? checkboxState) {
    setState(() {
      // Return checkboxState. If it's null, return false
      isChecked = checkboxState ?? false;
    });
  }

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

class TaskCheckbox extends StatelessWidget {
  const TaskCheckbox(
      {Key? key,
      required this.checkboxState,
      required this.toggleCheckboxState})
      : super(key: key);

  final bool checkboxState;
  final Function(bool?) toggleCheckboxState;

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