Fix `Checkbox` default visual density to meet Material 3 guidelines #159081

TahaTesser · 2024-11-18T16:34:36Z

Fixes Compact Visual Density is wrongfully applied to Checkboxes with MaterialTapTargetSize.padded on desktop platforms according to Material 3 Guidelines

Description

This PR updates default Checkbox visual density to not depend on ThemeData.visualDenSity as it will return VisualDensity.compact on desktop and break Material 3 guidelines for Checkbox.

Note

This makes a similar fix as #110722.

Code sample

expand to view the code sample

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              ColoredBox(
                color: Colors.amber,
                child: Checkbox(
                  materialTapTargetSize: MaterialTapTargetSize.padded,
                  value: true,
                  onChanged: (bool? value) {},
                ),
              ),
              Container(
                width: 48,
                height: 48,
                color: Colors.red,
                alignment: Alignment.center,
                child: const Text(
                  '48x48px',
                  style: TextStyle(fontSize: 10, color: Colors.white),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}

Pre-launch Checklist

I read the Contributor Guide and followed the process outlined there for submitting PRs.
I read the Tree Hygiene wiki page, which explains my responsibilities.
I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
I signed the CLA.
I listed at least one issue that this PR fixes in the description above.
I updated/added relevant documentation (doc comments with ///).
I added new tests to check the change I am making, or this PR is test-exempt.
I followed the breaking change policy and added Data Driven Fixes where supported.
All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

TahaTesser · 2024-11-21T15:26:50Z

@QuncCccccc
I was waiting for other PRs to merge before pinging you on this one. It looks like this change is failing some customer tests unlike one you did for IconButton. Do you have any ideas how we can land this?

QuncCccccc · 2024-12-03T07:33:11Z

Seems the failures happened in super_editor package. We might want to create a PR over there to fix the failures. The google testing hasn't been triggered, so I would expect some failures over there as well:)

TahaTesser · 2024-12-04T14:31:40Z

Seems the failures happened in super_editor package. We might want to create a PR over there to fix the failures. The google testing hasn't been triggered, so I would expect some failures over there as well:)

Could we please trigger Google Testing by approving so we can assess if we can even land this after super_editor tests fixes?

QuncCccccc · 2024-12-05T01:41:42Z

Sorry for the late response! I just triggered a local test(cl/702920348) to see whether it will cause g3 failures:)

Update: Google testing also has some failures but not too many:)

TahaTesser · 2024-12-06T15:46:34Z

@QuncCccccc
Thank you so much for getting back. I've filed a tiny patch for super_editor to fix customer testing Flutter-Bounty-Hunters/super_editor#2444

This includes overriding Checkbox.visualDensity to use ThemeData.visuaDesnity instead of the new default in this PR for those who don't follow M3 compliance .

TahaTesser · 2025-01-02T09:42:35Z

Updating flutter/tests super_editor registry to unblock this PR
PR: flutter/tests#437

This updates the super_editor test commit to bring Flutter-Bounty-Hunters/super_editor#2444 changes to the Flutter CI and unblocks Flutter PR, flutter/flutter#159081.

TahaTesser · 2025-01-23T19:42:18Z

Updating flutter/tests super_editor registry to unblock this PR PR: flutter/tests#437

With the flutter/test update done and rebased to fix format and analyzer issues. This is ready to review.

QuncCccccc

LGTM! Thanks for the fix! I'll take care of the Google testing failures if there are any:)

TahaTesser · 2025-01-29T15:30:32Z

LGTM! Thanks for the fix! I'll take care of the Google testing failures if there are any:)

Appreciate it!

QuncCccccc · 2025-01-30T17:27:22Z

cl/721408708 has landed, feel free to trigger the Google testing again:)!

…elines (flutter/flutter#159081)

Roll Flutter from b007899 to 8e2a6fc (61 revisions) flutter/flutter@b007899...8e2a6fc 2025-02-03 [email protected] Implement hot reload using the DDC library bundle format (flutter/flutter#162498) 2025-02-01 [email protected] [Android] add lint ignores to Flutter JNI. (flutter/flutter#162527) 2025-02-01 [email protected] Fix `Linux docs_publish` running at head (flutter/flutter#162557) 2025-02-01 [email protected] [Flutter GPU] Breaking: Use exceptions for resource creation errors. (flutter/flutter#162104) 2025-02-01 [email protected] [Impeller] Increase conical gradient precision. (flutter/flutter#162543) 2025-01-31 [email protected] Roll pub packages (flutter/flutter#162542) 2025-01-31 [email protected] [web] Gracefully handle empty ui.Vertices (flutter/flutter#162461) 2025-01-31 [email protected] [web] Remove HTML build artifacts (flutter/flutter#162528) 2025-01-31 [email protected] [ Tool ] Remove use of globals from widget-preview commands (flutter/flutter#162522) 2025-01-31 [email protected] Add a special case for the Fuchsia SDK ftl.fidl file in the license script (flutter/flutter#162423) 2025-01-31 [email protected] [Impeller] Remove some unused methods from EntityPassClipStack (flutter/flutter#162478) 2025-01-31 [email protected] Reenable linux_web_engine mac tests on Mac-14 (flutter/flutter#162409) 2025-01-31 [email protected] Fix NavigationRail examples overflow alignment (flutter/flutter#159937) 2025-01-31 [email protected] Roll Skia from c1dc5033e7c9 to 4bdf90faf708 (1 revision) (flutter/flutter#162511) 2025-01-31 [email protected] Roll Skia from e0941791b86e to c1dc5033e7c9 (1 revision) (flutter/flutter#162504) 2025-01-31 [email protected] [Reland] Fix `Tab` linear and elastic animation blink (#162315) (flutter/flutter#162450) 2025-01-31 [email protected] fix syntax error in comment pseudocode (flutter/flutter#162453) 2025-01-31 [email protected] Roll Skia from ec8c632b8c7f to e0941791b86e (1 revision) (flutter/flutter#162502) 2025-01-31 [email protected] Roll Skia from a9af2a74c5ab to ec8c632b8c7f (2 revisions) (flutter/flutter#162496) 2025-01-31 [email protected] Roll pub packages (flutter/flutter#162476) 2025-01-31 [email protected] Document flutter/package deps version policy (flutter/flutter#162492) 2025-01-31 [email protected] Add iOS tool codeowner (flutter/flutter#162167) 2025-01-31 [email protected] Fixed the text aspect ratio (flutter/flutter#162415) 2025-01-31 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Delete `FlutterCommand.usageValues` (#162468)" (flutter/flutter#162494) 2025-01-31 [email protected] Add new web contributors to web triage doc. (flutter/flutter#162420) 2025-01-30 [email protected] Fix the build borked in flutter/flutter#162475. (flutter/flutter#162484) 2025-01-30 [email protected] Roll Skia from e6daf687b558 to a9af2a74c5ab (5 revisions) (flutter/flutter#162474) 2025-01-30 [email protected] Bump `Linux mac_clang_tidy" to 120m timeout (flutter/flutter#162475) 2025-01-30 [email protected] Delete `FlutterCommand.usageValues` (flutter/flutter#162468) 2025-01-30 [email protected] Fixed some floating point inaccuracies in TextContents (flutter/flutter#162351) 2025-01-30 [email protected] Limit number of retries when downloading the Dart SDK on Windows (flutter/flutter#162411) 2025-01-30 [email protected] Add FormField.errorBuilder (flutter/flutter#162255) 2025-01-30 [email protected] Fix `Checkbox` default visual density to meet Material 3 guidelines (flutter/flutter#159081) 2025-01-30 [email protected] [Android] add HC++ platform view class. (flutter/flutter#161829) 2025-01-30 [email protected] Add tests to confirm CupertinoSliverNavigationBar snaps when partially scrolled in .always bottom mode (flutter/flutter#162425) 2025-01-30 [email protected] [Impeller] Disable Vulkan on Emulators. (flutter/flutter#162454) 2025-01-30 [email protected] [FGP Kotlin conversion] Convert `Deeplink` and `IntentFilterCheck` (flutter/flutter#161835) 2025-01-30 [email protected] fix slider semantic label (flutter/flutter#162304) 2025-01-30 [email protected] Roll Skia from f22419dbed05 to e6daf687b558 (37 revisions) (flutter/flutter#162447) 2025-01-30 [email protected] Fix `flutter doctor` instructions displayed when `cmdline-tools` (Android SDK) cannot be found (flutter/flutter#162281) 2025-01-30 [email protected] remove more (simple) usage of package:usage (flutter/flutter#162354) 2025-01-30 [email protected] [Android] HC++ plumbing. (flutter/flutter#162407) 2025-01-30 [email protected] Removes dev dependencies from generated plugin registrant for non-Android platforms (flutter/flutter#161828) 2025-01-30 [email protected] Fix unexpected shown of Scrollbar (flutter/flutter#159386) 2025-01-30 [email protected] Roll package:vm_service to 15.0.0 and package:leak_tracker to 10.0.9 (flutter/flutter#162325) 2025-01-30 [email protected] Roll Fuchsia Test Scripts from r9Dc5VRF6sE3pJH20... to g6IlaYL1_wNmk3zNj... (flutter/flutter#162427) ...

This updates the super_editor test commit to bring Flutter-Bounty-Hunters/super_editor#2444 changes to the Flutter CI and unblocks Flutter PR, flutter/flutter#159081.

…elines (flutter/flutter#159081)

Roll Flutter from b007899 to 8e2a6fc (61 revisions) flutter/flutter@b007899...8e2a6fc 2025-02-03 [email protected] Implement hot reload using the DDC library bundle format (flutter/flutter#162498) 2025-02-01 [email protected] [Android] add lint ignores to Flutter JNI. (flutter/flutter#162527) 2025-02-01 [email protected] Fix `Linux docs_publish` running at head (flutter/flutter#162557) 2025-02-01 [email protected] [Flutter GPU] Breaking: Use exceptions for resource creation errors. (flutter/flutter#162104) 2025-02-01 [email protected] [Impeller] Increase conical gradient precision. (flutter/flutter#162543) 2025-01-31 [email protected] Roll pub packages (flutter/flutter#162542) 2025-01-31 [email protected] [web] Gracefully handle empty ui.Vertices (flutter/flutter#162461) 2025-01-31 [email protected] [web] Remove HTML build artifacts (flutter/flutter#162528) 2025-01-31 [email protected] [ Tool ] Remove use of globals from widget-preview commands (flutter/flutter#162522) 2025-01-31 [email protected] Add a special case for the Fuchsia SDK ftl.fidl file in the license script (flutter/flutter#162423) 2025-01-31 [email protected] [Impeller] Remove some unused methods from EntityPassClipStack (flutter/flutter#162478) 2025-01-31 [email protected] Reenable linux_web_engine mac tests on Mac-14 (flutter/flutter#162409) 2025-01-31 [email protected] Fix NavigationRail examples overflow alignment (flutter/flutter#159937) 2025-01-31 [email protected] Roll Skia from c1dc5033e7c9 to 4bdf90faf708 (1 revision) (flutter/flutter#162511) 2025-01-31 [email protected] Roll Skia from e0941791b86e to c1dc5033e7c9 (1 revision) (flutter/flutter#162504) 2025-01-31 [email protected] [Reland] Fix `Tab` linear and elastic animation blink (#162315) (flutter/flutter#162450) 2025-01-31 [email protected] fix syntax error in comment pseudocode (flutter/flutter#162453) 2025-01-31 [email protected] Roll Skia from ec8c632b8c7f to e0941791b86e (1 revision) (flutter/flutter#162502) 2025-01-31 [email protected] Roll Skia from a9af2a74c5ab to ec8c632b8c7f (2 revisions) (flutter/flutter#162496) 2025-01-31 [email protected] Roll pub packages (flutter/flutter#162476) 2025-01-31 [email protected] Document flutter/package deps version policy (flutter/flutter#162492) 2025-01-31 [email protected] Add iOS tool codeowner (flutter/flutter#162167) 2025-01-31 [email protected] Fixed the text aspect ratio (flutter/flutter#162415) 2025-01-31 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Delete `FlutterCommand.usageValues` (#162468)" (flutter/flutter#162494) 2025-01-31 [email protected] Add new web contributors to web triage doc. (flutter/flutter#162420) 2025-01-30 [email protected] Fix the build borked in flutter/flutter#162475. (flutter/flutter#162484) 2025-01-30 [email protected] Roll Skia from e6daf687b558 to a9af2a74c5ab (5 revisions) (flutter/flutter#162474) 2025-01-30 [email protected] Bump `Linux mac_clang_tidy" to 120m timeout (flutter/flutter#162475) 2025-01-30 [email protected] Delete `FlutterCommand.usageValues` (flutter/flutter#162468) 2025-01-30 [email protected] Fixed some floating point inaccuracies in TextContents (flutter/flutter#162351) 2025-01-30 [email protected] Limit number of retries when downloading the Dart SDK on Windows (flutter/flutter#162411) 2025-01-30 [email protected] Add FormField.errorBuilder (flutter/flutter#162255) 2025-01-30 [email protected] Fix `Checkbox` default visual density to meet Material 3 guidelines (flutter/flutter#159081) 2025-01-30 [email protected] [Android] add HC++ platform view class. (flutter/flutter#161829) 2025-01-30 [email protected] Add tests to confirm CupertinoSliverNavigationBar snaps when partially scrolled in .always bottom mode (flutter/flutter#162425) 2025-01-30 [email protected] [Impeller] Disable Vulkan on Emulators. (flutter/flutter#162454) 2025-01-30 [email protected] [FGP Kotlin conversion] Convert `Deeplink` and `IntentFilterCheck` (flutter/flutter#161835) 2025-01-30 [email protected] fix slider semantic label (flutter/flutter#162304) 2025-01-30 [email protected] Roll Skia from f22419dbed05 to e6daf687b558 (37 revisions) (flutter/flutter#162447) 2025-01-30 [email protected] Fix `flutter doctor` instructions displayed when `cmdline-tools` (Android SDK) cannot be found (flutter/flutter#162281) 2025-01-30 [email protected] remove more (simple) usage of package:usage (flutter/flutter#162354) 2025-01-30 [email protected] [Android] HC++ plumbing. (flutter/flutter#162407) 2025-01-30 [email protected] Removes dev dependencies from generated plugin registrant for non-Android platforms (flutter/flutter#161828) 2025-01-30 [email protected] Fix unexpected shown of Scrollbar (flutter/flutter#159386) 2025-01-30 [email protected] Roll package:vm_service to 15.0.0 and package:leak_tracker to 10.0.9 (flutter/flutter#162325) 2025-01-30 [email protected] Roll Fuchsia Test Scripts from r9Dc5VRF6sE3pJH20... to g6IlaYL1_wNmk3zNj... (flutter/flutter#162427) ...

github-actions bot added framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels Nov 18, 2024

TahaTesser force-pushed the fix_m3_checkBox_density branch from 7cc0722 to b9cbbd5 Compare November 19, 2024 08:49

TahaTesser force-pushed the fix_m3_checkBox_density branch from b9cbbd5 to fbfc502 Compare November 26, 2024 16:07

TahaTesser force-pushed the fix_m3_checkBox_density branch from fbfc502 to 993ba76 Compare December 4, 2024 14:30

TahaTesser mentioned this pull request Dec 6, 2024

Update TaskNodes Checkbox visual density to depend on the ThemeData.visualDensity Flutter-Bounty-Hunters/super_editor#2444

Merged

TahaTesser mentioned this pull request Jan 2, 2025

Update super_editor test commit flutter/tests#437

Merged

8 tasks

TahaTesser force-pushed the fix_m3_checkBox_density branch 4 times, most recently from d79a70a to 071c191 Compare January 17, 2025 08:47

TahaTesser force-pushed the fix_m3_checkBox_density branch from 754b670 to 718bec4 Compare January 23, 2025 14:44

TahaTesser marked this pull request as ready for review January 23, 2025 15:27

TahaTesser requested a review from QuncCccccc January 23, 2025 15:27

QuncCccccc approved these changes Jan 23, 2025

View reviewed changes

Fix Checkbox default visual density to meet Material 3 guidelines

8c37e57

TahaTesser force-pushed the fix_m3_checkBox_density branch from 718bec4 to 8c37e57 Compare January 30, 2025 18:12

Kick tests

fda8506

TahaTesser added the autosubmit Merge PR when tree becomes green via auto submit App label Jan 30, 2025

auto-submit bot added this pull request to the merge queue Jan 30, 2025

Merged via the queue into flutter:master with commit 9d7d36c Jan 30, 2025
148 checks passed

flutter-dashboard bot removed the autosubmit Merge PR when tree becomes green via auto submit App label Jan 30, 2025

TahaTesser deleted the fix_m3_checkBox_density branch January 30, 2025 21:14

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jan 31, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

8b10d41

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jan 31, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

be968c9

…elines (flutter/flutter#159081)

Piinks mentioned this pull request Jan 31, 2025

Flutter Notable Commits - 2025 #161460

Open

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 1, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

1d2bd85

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 1, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

eb608f5

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 2, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

08a87cf

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 2, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

2dd074d

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 3, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

dce020a

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 3, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

b5ddb63

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 20, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

18c29f1

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 20, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

55c49c7

…elines (flutter/flutter#159081)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 21, 2025

9d7d36c Fix Checkbox default visual density to meet Material 3 guid…

8fcfc17

…elines (flutter/flutter#159081)

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Fix `Checkbox` default visual density to meet Material 3 guidelines #159081

Fix `Checkbox` default visual density to meet Material 3 guidelines #159081

Uh oh!

TahaTesser commented Nov 18, 2024 •

edited

Loading

Uh oh!

TahaTesser commented Nov 21, 2024

Uh oh!

QuncCccccc commented Dec 3, 2024

Uh oh!

TahaTesser commented Dec 4, 2024

Uh oh!

QuncCccccc commented Dec 5, 2024 •

edited

Loading

Uh oh!

TahaTesser commented Dec 6, 2024 •

edited

Loading

Uh oh!

TahaTesser commented Jan 2, 2025

Uh oh!

TahaTesser commented Jan 23, 2025

Uh oh!

QuncCccccc left a comment

Uh oh!

TahaTesser commented Jan 29, 2025

Uh oh!

QuncCccccc commented Jan 30, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Fix Checkbox default visual density to meet Material 3 guidelines #159081

Fix Checkbox default visual density to meet Material 3 guidelines #159081

Uh oh!

Conversation

TahaTesser commented Nov 18, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Code sample

Pre-launch Checklist

Uh oh!

TahaTesser commented Nov 21, 2024

Uh oh!

QuncCccccc commented Dec 3, 2024

Uh oh!

TahaTesser commented Dec 4, 2024

Uh oh!

QuncCccccc commented Dec 5, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

TahaTesser commented Dec 6, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

TahaTesser commented Jan 2, 2025

Uh oh!

TahaTesser commented Jan 23, 2025

Uh oh!

QuncCccccc left a comment

Choose a reason for hiding this comment

Uh oh!

TahaTesser commented Jan 29, 2025

Uh oh!

QuncCccccc commented Jan 30, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Fix `Checkbox` default visual density to meet Material 3 guidelines #159081

Fix `Checkbox` default visual density to meet Material 3 guidelines #159081

TahaTesser commented Nov 18, 2024 •

edited

Loading

QuncCccccc commented Dec 5, 2024 •

edited

Loading

TahaTesser commented Dec 6, 2024 •

edited

Loading