Checkbox

Checkboxes allow the user to select one or more items from a set.

Checkboxes can be used to turn an option on or off. If you have multiple options appearing in a list, you can preserve space by using checkboxes.

It does not hold state in itself. This means the checked state needs to be handled outside of the widget. The values can be provided and updated using the checked and onChanged properties on the CheckboxX constructors.

bool checked = false;

CheckboxX(
  checked: checked,
  onChanged: (v) => setState(() => checked = v),
),

It makes use of the active variant, that can be used alongside other variants, such as hover, press and disable, to provide the best effect to the end-user.

CheckboxX(
  mix: Mix(
    (hover | active)( // if hovering and active
      borderColor($primary), // the color of the border is [$primary]
    )
  ),
  ...,
),