Flutter Checkbox - how to set colour in unchecked state-CodePudding

In Flutter a Checkbox appears to be transparent, in its natural unchecked state. I would like to know how to set the colour of the box in this state.

There are many similar questions here but they all ask to change the active colour, or the colour of the tick. I've tried all of the available properties but none of them seem to affect the unchecked state (not even fillColor). My goal is to create a solid white checkbox (square with rounded corners) which shows up against a non-white background.

child: Checkbox(
  checkColor: Colors.red,
  activeColor: Colors.white,
  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
  onChanged: (value) {},
),

CodePudding user response：

Paint has been done on source code. we can trick the UI by wrapping Checkbox with Container and providing decoration also we need to changes some properties on Checkbox.

child: Container(
  decoration: BoxDecoration(
    color: Colors.white,
    borderRadius: BorderRadius.circular(8),
  ),
  child: Checkbox(
    value: _isChecked,
    hoverColor: Colors.transparent,
    fillColor: MaterialStateProperty.all<Color>(Colors.white),
    checkColor: Colors.red,
    activeColor: Colors.white,
    shape:
        RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
    onChanged: (value) {
      setState(() {
        _isChecked = !_isChecked;
      });
    },
  ),
),

To improve padding-space, we can use Transform.scale and control the size from Container. but for too small(~12) cases, It may cause some UI trouble.

 Container(
  width: 24,
  height: 24,
  decoration: BoxDecoration(
    color: Colors.white,
    borderRadius: BorderRadius.circular(8),
  ),
  child: Transform.scale(
    scale: 1.2,
    child: Checkbox(...