Skip to content

CupertinoCheckbox padding on MacOS is excessive, is applying iOS standards #165140

@driftwoodstudio

Description

@driftwoodstudio

Steps to reproduce

Build and run on MacOS desktop any CupertinoApp with a widget with stacked checkboxes, such as:

Column(children: [
  CupertinoCheckbox(value: true, onChanged: (){}),
  CupertinoCheckbox(value: true, onChanged: (){}),
  CupertinoCheckbox(value: true, onChanged: (){}),
])

Observe that the three stacked checkboxes have excessive vertical spacing, and no means of reducing it (no parameters dev can pass to constructor will reduce vertical spacing).

This is caused by:

https://github.com/flutter/flutter/tree/main/packages/flutter/lib/src/cupertino/checkbox.dart

Line 433: 
  size: const Size.square(kMinInteractiveDimensionCupertino),

Where constants.dart is:
  const double kMinInteractiveDimensionCupertino = 44.0;

That causes minimum size of buildToggleable() result to be the minimum tap-target size for iOS, which is the wrong standard to be applying if Platform.isMacOS.

Note that this default behavior of CupertinoCheckbox is not even internally consistent with behavior of CupertinoRadio where minimum is set as:

const Size _size = Size(18.0, 18.0);

Expected results

Minimum spacing for checkboxes set consistent with a desktop-OS platform with precision pointing device.

Actual results

Minimum spacing is set for "stab at it with a fat finger" iOS standards, and cannot be reduced.

Suggested Fix

I've forked the checkbox.dart file and find that using the CupertinoRadio's default value of 18 instead produces the best results, letting the developer optionally add additional padding around the Widget if needed:

const minCheckboxSquareSizeMacOS = 18.0;

Making the line in checkbox build():

  size: const Size.square( Platform.isMacOS ? minCheckboxSquareSizeMacOS : kMinInteractiveDimensionCupertino ),

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work lista: desktopRunning on desktopa: fidelityMatching the OEM platforms betterf: cupertinoflutter/packages/flutter/cupertino repositoryfound in release: 3.29Found to occur in 3.29found in release: 3.30Found to occur in 3.30frameworkflutter/packages/flutter repository. See also f: labels.good first issueRelatively approachable for first-time contributorshas reproducible stepsThe issue has been confirmed reproducible and is ready to work onplatform-macBuilding on or for macOS specificallyr: fixedIssue is closed as already fixed in a newer versionteam-designOwned by Design Languages teamtriaged-designTriaged by Design Languages team

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions