How to fill color inside of checkbox in flutter?

Issue

Here is what I am using for checkbox in flutter.
But I can set only border color for unchecked state, not method found for fill color inside of the checkbox.
Please help me with this.

Theme(
    data: ThemeData(unselectedWidgetColor: Colors.white),
    child: Checkbox(
        checkColor: Colors.blue,
        activeColor: Colors.white,
        value: rememberMe,
        onChanged: (value) {
            setState(() {
                rememberMe = value;
            });
        },
    ),
)

Solution

That is more related to design itself. An empty checkbox should be exactly that, empty. If you give it a fill color, you are kind of defeating the design purpose.

Regardless, you could achieve this by putting it inside a Container with a background color and the width and height to only fill the CheckBox:

return Center(
  child: Container(
    alignment: Alignment.center,
    width: 14,
    height: 14,
    color: Colors.blue,
    child: Checkbox(
      checkColor: Colors.blue,
      activeColor: Colors.white,
      value: rememberMe,
      onChanged: (value) {
        setState(() {
          rememberMe = value;
        });
      },
    ),
  ),
);

Answered By – João Soares

Answer Checked By – David Goodson (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *