checkboxThemeData static method

CheckboxThemeData checkboxThemeData(Palette colors)

Implementation

static CheckboxThemeData checkboxThemeData(Palette colors) {
  return CheckboxThemeData(
    mouseCursor: const WidgetStatePropertyAll(
      null,
    ), // allows widget to default to clickable
    fillColor: WidgetStateProperty.resolveWith((states) {
      if (states.contains(WidgetState.selected)) {
        return colors.fill;
      } else if (states.contains(WidgetState.hovered)) {
        return colors.textHovered;
      } else if (states.contains(WidgetState.pressed)) {
        return colors.textSplashed;
      } else {
        return colors.background;
      }
    }),
    // Even though it is an icon, it is displayed very small, text is a better
    // fit (icon implies a height of 40 dp / 18 pt in parlance of WCAG 2.1)
    checkColor: WidgetStateProperty.all(colors.fillText),
    overlayColor: WidgetStateProperty.resolveWith((states) {
      if (states.contains(WidgetState.selected)) {
        return colors.textHovered;

        // Note 1:
        // Even though this is "wrong", i.e. the checkbox is filled,
        // Checkbox is unique in that its overlay isn't actually displayed in
        // the component, but around it. It feels more accurate to use the
        // same overlay color as when it is not selected.
        //
        // Note 2: Other states aren't respected here, even if supplied. Ex.
        // selected doesn't distinguish between being hovered and pressed.
      } else if (states.contains(WidgetState.hovered)) {
        return colors.textHovered;
      } else if (states.contains(WidgetState.pressed)) {
        return colors.textSplashed;
      } else {
        return colors.background;
      }
    }),
    splashRadius: 20.0, // match M3 default
    materialTapTargetSize: null, // let Theme manage it
    visualDensity: null, // let Theme manage it
    shape: const RoundedRectangleBorder(
      borderRadius: BorderRadius.all(Radius.circular(2.0)),
    ), // match default
    side: BorderSide(width: 2.0, color: colors.fill), // match default
  );
}