Not being able to pass bool value

Question

I am getting error while trying to pass bool value to the TaskCheckbox() method. I am new to flutter and any help would be much appreciated

class _TaskTileState extends State<TaskTile> {
          bool? isChecked = false;
        
          @override
          Widget build(BuildContext context) {
            return const ListTile(
              title: Text('This is a task'),
              trailing: TaskCheckbox(isChecked),
            );
          }
    
    }
    
    class TaskCheckbox extends StatelessWidget {
      final bool? checkboxState;
      const TaskCheckbox(this.checkboxState, {Key? key}) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        return Checkbox(
          value: checkboxState,
          onChanged: (newValue) {},
        );
      }
    }

Md. Yeasin Sheikh · Answer 1 · 2021-12-01T11:45:18.510

0

You need to remove const before ListTile because the value will get on runtime.

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text('This is a task'),
      trailing: TaskCheckbox(isChecked),
    );
  }

const keyword used to make a variable to store a compile time constant value. Compile time constant value is a value which will be constant while compiling , ref

edited Dec 01 '21 at 11:45

answered Dec 01 '21 at 11:13

Md. Yeasin Sheikh

54,221
7
29
56

I have been following Dr Angela Yu's flutter course. Are there any other materials online you would suggest to a someone like me who is completely new to programming?? – Sanjay Dec 01 '21 at 14:22
I firstly suggest following official doc on flutter.dev and pub.dev , you can also find on flutter channel on youtube. – Md. Yeasin Sheikh Dec 01 '21 at 14:48

Septian Dika · Answer 2 · 2021-12-01T12:04:28.190

You need to use Stateful Class widget for the build checkbox because we need to use setState for changing value inside the checkbox.

Use this code. This work fine for me:

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

class _TaskTileState extends State<MyHomePage> {
  bool? isChecked = true;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text('This is a task'),
      trailing: TaskCheckbox(isChecked),
    );
  }
}


class TaskCheckbox extends StatefulWidget {
  final bool? checkboxState;
  const TaskCheckbox(this.checkboxState, {Key? key}) : super(key: key);

  @override
  State<TaskCheckbox> createState() => _TaskCheckboxState();
}

class _TaskCheckboxState extends State<TaskCheckbox> {
  bool? isChecked;
  
  @override
  void initState() {
    isChecked = widget.checkboxState;
  }

  @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.black,
      fillColor: MaterialStateProperty.resolveWith(getColor),
      value: isChecked,
      onChanged: (bool? value) {
        setState(() {
          isChecked = value!;
        });
      },
    );
  }
}

Related from @Yeasin Sheikh's answer, you do have to remove the const in the ListView

I will use the Stateful Class widget like you mentioned :) – Sanjay Dec 01 '21 at 14:24 — Sanjay, Dec 01 '21 at 14:24

Not being able to pass bool value

2 Answers2