[material_ui] Add Checkbox.markInsets by Munawer-Ali · Pull Request #12690 · flutter/packages

Munawer-Ali · 2026-08-30T11:14:07Z

This PR ports my changes from flutter/flutter#188258 to
flutter/packages,
as part of flutter/flutter#188444

Adds Checkbox.markInsets and CheckboxThemeData.markInsets, which inset the check
mark and the
indeterminate dash within the checkbox without changing the size of the box itself. The
mark and its
stroke shrink proportionally, and the mark is not painted if the insets leave no room.

Fixes flutter/flutter#188031

Tests

Added to packages/material_ui/test/checkbox_test.dart:

Checkbox.markInsets defaults to null
Checkbox with no markInsets paints the check at full stroke width (backward-compat)
Checkbox.markInsets shrinks the check mark and its stroke
Checkbox.markInsets shrinks the indeterminate dash
Checkbox.markInsets larger than the box collapses the mark without crashing
Checkbox.markInsets falls back to CheckboxThemeData.markInsets
Checkbox.markInsets overrides CheckboxThemeData.markInsets

Pre-Review Checklist

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

Note: The Flutter team is currently trialing the use of Gemini Code Assist for GitHub. Comments from the gemini-code-assist bot should not be taken as authoritative feedback from the Flutter team. If you find its comments useful you can update your code accordingly, but if you are unsure or disagree with the feedback, please feel free to wait for a Flutter team member's review for guidance on which automated comments should be addressed.

Regular contributors who have demonstrated familiarity with the repository guidelines only need to comment if the PR is not auto-exempted by repo tooling. ↩ ↩²

gemini-code-assist

Code Review

This pull request introduces 'markInsets' to 'Checkbox' and 'CheckboxThemeData' to allow insetting the check mark and indeterminate dash within the checkbox, shrinking them proportionally without altering the overall box size. The feedback suggests adding assertions in the 'Checkbox' constructors and the '_CheckboxPainter' setter to enforce that 'markInsets' is non-negative, as specified in the documentation.

gemini-code-assist · 2026-08-30T11:15:19Z

  }) : _checkboxType = _CheckboxType.material,
       assert(tristate || value != null);


Since the documentation for markInsets states that it "Must be non-negative", we should enforce this constraint with an assertion in the constructor to catch invalid values early in development.

}) : _checkboxType = _CheckboxType.material, assert(tristate || value != null), assert(markInsets == null || (markInsets.left >= 0.0 && markInsets.top >= 0.0 && markInsets.right >= 0.0 && markInsets.bottom >= 0.0), 'markInsets must be non-negative.');

Checkbox is a const constructor, so this suggestion won't compile. We should assert on the markInsets setter below instead.

gemini-code-assist · 2026-08-30T11:15:19Z

  }) : _checkboxType = _CheckboxType.adaptive,
       assert(tristate || value != null);


Similarly, we should add the non-negative assertion for markInsets in the Checkbox.adaptive constructor.

}) : _checkboxType = _CheckboxType.adaptive, assert(tristate || value != null), assert(markInsets == null || (markInsets.left >= 0.0 && markInsets.top >= 0.0 && markInsets.right >= 0.0 && markInsets.bottom >= 0.0), 'markInsets must be non-negative.');

Same comment as above, Checkbox.adaptive is a const constructor, so this suggestion won't compile.

gemini-code-assist · 2026-08-30T11:15:19Z

+  set markInsets(EdgeInsets value) {
+    if (_markInsets == value) {
+      return;
+    }
+    _markInsets = value;
+    notifyListeners(); // triggers repaint when it changes
+  }


To ensure that invalid negative insets provided via CheckboxThemeData (which doesn't have constructor assertions) are also caught before they cause rendering anomalies, we should add an assertion in the _CheckboxPainter.markInsets setter.

set markInsets(EdgeInsets value) { if (_markInsets == value) { return; } assert(value.left >= 0.0 && value.top >= 0.0 && value.right >= 0.0 && value.bottom >= 0.0, 'markInsets must be non-negative.'); _markInsets = value; notifyListeners(); // triggers repaint when it changes }

Valid suggestion, but assert(value.isNonNegative, 'markInsets must be non-negative.') is more readable.

elliette · 2026-09-01T21:32:45Z

Thank you for your contribution! Because of the volume of PRs we receive, we require that new contributors use our checklist to guide them through critical steps in creating a Flutter PR. This PR's description is missing that checklist, so it is being marked as a Draft.

Please edit the PR description to add the checklist, then ensure that you have completed all of the steps. Once you've done that, please mark the PR as ready for review.

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

Munawer-Ali · 2026-09-02T05:57:29Z

@elliette Thanks! I've added the Pre-Review Checklist to the description and completed the steps.
Marking as ready for review.

gemini-code-assist

Code Review

This pull request introduces markInsets to Checkbox and CheckboxThemeData, allowing the check mark and indeterminate dash to be inset and scaled proportionally within the checkbox. The reviewer recommends adding assertions to the Checkbox, Checkbox.adaptive, and CheckboxThemeData constructors to enforce that markInsets values are non-negative, along with a corresponding unit test to verify this validation.

QuncCccccc

LGTM. Thank you for helping port over the fix!

elliette · 2026-09-02T23:13:50Z

  /// {@endtemplate}
  final String? semanticLabel;

+  /// {@template flutter.material.checkbox.markInsets}


This should be {@template material_ui.checkbox.markInsets} now :)

elliette · 2026-09-02T23:14:24Z

  /// If specified, overrides the default value of [Checkbox.side].
  final BorderSide? side;

+  /// {@macro flutter.material.checkbox.markInsets}


Also here {@macro material_ui.checkbox.markInsets}

elliette · 2026-09-02T23:14:55Z

+    - Adds `Checkbox.markInsets` and `CheckboxThemeData.markInsets`, which inset the
+      check mark (and the indeterminate dash) within the checkbox without changing the
+      size of the box itself. The mark and its stroke shrink proportionally.
+  version: minor


Please add a new line at the end of this file

newline

Munawer-Ali · 2026-09-04T12:50:31Z

Thanks for the review @elliette Updated the dartdoc template and macro to
material_ui.checkbox.markInsets in both files, and added the trailing newline
to the changelog file.

Munawer-Ali · 2026-09-09T13:59:46Z

@QuncCccccc Hi Ma’am, could you please review and approve the changes in this PR when you have a chance? Thank you!

QuncCccccc

LGTM. Thanks!

Munawer-Ali · 2026-09-14T13:41:29Z

Hi @elliette , could you please take a look at this PR when you get a chance?

Munawer-Ali · 2026-09-18T08:33:24Z

@QuncCccccc Sorry to disturb you again, Ma’am. Could you please ask @elliette to review this PR as well when you get a chance?

Thank you so much for your support! 🙏

elliette · 2026-09-19T00:11:40Z

  }) : _checkboxType = _CheckboxType.material,
       assert(tristate || value != null);


Checkbox is a const constructor, so this suggestion won't compile. We should assert on the markInsets setter below instead.

elliette · 2026-09-19T00:12:22Z

  }) : _checkboxType = _CheckboxType.adaptive,
       assert(tristate || value != null);


Same comment as above, Checkbox.adaptive is a const constructor, so this suggestion won't compile.

elliette · 2026-09-19T00:14:51Z

+  set markInsets(EdgeInsets value) {
+    if (_markInsets == value) {
+      return;
+    }
+    _markInsets = value;
+    notifyListeners(); // triggers repaint when it changes
+  }


Valid suggestion, but assert(value.isNonNegative, 'markInsets must be non-negative.') is more readable.

elliette · 2026-09-19T00:20:24Z

+  ///
+  /// This insets the check mark inward; the size of the checkbox box itself
+  /// is not affected. The check mark and its stroke shrink to fit the
+  /// remaining space, so the mark stays proportional.


"so the mark stays proportional"

Please add some test cases to confirm this - currently they are all using EdgeInsets.all (e.g. test with EdgeInsets.only(left: 9)).

I agree. I suggest adding the following sentence at the end of this paragraph for clarity:

/// Its size is the smaller of the remaining width and height, and it is /// centered in the remaining space, so an inset on one axis also shrinks it /// on the other. For example, `EdgeInsets.only(left: 9.0)` draws a /// half-size mark centered in the right half of the box.

and also adding a test for this case.

proportional

elliette

Thanks! One more suggestion otherwise looks good

Munawer-Ali · 2026-10-06T15:54:20Z

@QuncCccccc please ask @elliette to review it again when they have a chance?

Munawer-Ali · 2026-10-12T12:49:14Z

Hi @QuncCccccc, thanks for approving my PR! Could you please help get the remaining review from the other reviewer so we can move forward with merging it? I’d really appreciate your help. Thanks again!

Munawer-Ali · 2026-10-15T19:02:14Z

Thanks @dkwingsmt ! Added the suggested sentence to the markInsets docs and a test.

Munawer-Ali · 2026-10-21T12:34:27Z

@QuncCccccc please ask @elliette or @dkwingsmt to review it again when they have a chance?

elliette

Thanks for your patience! Looks good

dkwingsmt

LGTM. Thank you for keeping polishing it!

flutter/packages@23a05b6...a8549ae 2026-10-27 [email protected] [material_ui] Deprecate the black/white parameters in `Typography.material2021` (flutter/packages#13443) 2026-10-27 [email protected] [shared_preferences] Defer SharedPreferences fetch in `LegacySharedPreferencesPlugin` until first use on Android (flutter/packages#13431) 2026-10-27 [email protected] [material_ui] Fix MenuAnchor non-Unicode shortcut labels on JS web (flutter/packages#13370) 2026-10-27 [email protected] [material_ui] Add Checkbox.markInsets (flutter/packages#12690) 2026-10-27 [email protected] [vector_graphics_compiler] Handle coordinate lists on text and tspan (flutter/packages#13287) 2026-10-27 [email protected] [cupertino_ui] Unskip web tests that pass on CanvasKit and Skwasm: nav_bar_transition_test, refresh_test, route_test, text_field_cursor_test (flutter/packages#13439) 2026-10-27 [email protected] [material_ui] Fix `TextTheme` and `Typography` `debugFillProperties` defaults (flutter/packages#13374) 2026-10-27 [email protected] [material_ui] Update out-of-date typography documentation (flutter/packages#13372) 2026-10-27 [email protected] [shared_preferences_foundation] Fix web compilation of apps that import the package (flutter/packages#13447) 2026-10-26 [email protected] Fix AI guidelines link in PR template (flutter/packages#13411) If this roll has caused a breakage, revert this CL and set the roller to dry run mode using the controls here: https://autoroll.skia.org/r/flutter-packages-flutter-autoroll Please CC [email protected] on the revert to ensure that a human is aware of the problem. To file a bug in Flutter: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

[material_ui] Add Checkbox.markInsets

6334c25

github-actions Bot added p: material_ui triage-design Should be looked at in design triage labels Aug 30, 2026

gemini-code-assist Bot reviewed Aug 30, 2026

View reviewed changes

Munawer-Ali mentioned this pull request Aug 30, 2026

Add markInsets property to Checkbox flutter/flutter#188258

Closed

9 of 10 tasks

elliette requested review from QuncCccccc and removed request for QuncCccccc September 1, 2026 21:32

elliette marked this pull request as draft September 1, 2026 21:32

Munawer-Ali marked this pull request as ready for review September 2, 2026 05:55

gemini-code-assist Bot reviewed Sep 2, 2026

View reviewed changes

Comment thread packages/material_ui/lib/src/checkbox.dart Resolved

Comment thread packages/material_ui/lib/src/checkbox.dart Resolved

Comment thread packages/material_ui/lib/src/checkbox_theme.dart Resolved

Comment thread packages/material_ui/test/checkbox_test.dart Resolved

QuncCccccc approved these changes Sep 2, 2026

View reviewed changes

QuncCccccc added the CICD Run CI/CD label Sep 2, 2026

QuncCccccc requested a review from elliette September 2, 2026 21:37

elliette added CICD Run CI/CD and removed CICD Run CI/CD labels Sep 2, 2026

elliette reviewed Sep 2, 2026

View reviewed changes

Address review: namespace dartdoc template as material_ui, add trailing

0beedec

newline

flutter-dashboard Bot removed the CICD Run CI/CD label Sep 4, 2026

QuncCccccc added the CICD Run CI/CD label Sep 10, 2026

QuncCccccc approved these changes Sep 10, 2026

View reviewed changes

Merge branch 'main' into checkbox-mark-insets

2628a5b

flutter-dashboard Bot removed the CICD Run CI/CD label Sep 12, 2026

elliette reviewed Sep 19, 2026

View reviewed changes

Address review: assert non-negative markInsets, keep the mark

c1515ba

proportional

QuncCccccc added the CICD Run CI/CD label Sep 30, 2026

Merge branch 'main' into checkbox-mark-insets

adba314

flutter-dashboard Bot removed the CICD Run CI/CD label Sep 30, 2026

elliette added the CICD Run CI/CD label Sep 30, 2026

elliette reviewed Sep 30, 2026

View reviewed changes

Comment thread packages/material_ui/lib/src/checkbox_theme.dart Resolved

Munawer-Ali added 2 commits October 2, 2026 00:01

Address review: add markInsets coverage to CheckboxThemeData tests

d86b9f4

Address review: add markInsets coverage to CheckboxThemeData tests

a84ec1e

flutter-dashboard Bot removed the CICD Run CI/CD label Oct 1, 2026

Merge branch 'main' into checkbox-mark-insets

f5c9041

Munawer-Ali requested a review from elliette October 2, 2026 21:16

QuncCccccc added the CICD Run CI/CD label Oct 2, 2026

QuncCccccc requested a review from dkwingsmt October 6, 2026 21:16

document markInsets sizing and centering, add test

4055c45

flutter-dashboard Bot removed the CICD Run CI/CD label Oct 15, 2026

elliette approved these changes Oct 22, 2026

View reviewed changes

elliette added the autosubmit Merge PR when tree becomes green via auto submit App label Oct 22, 2026

dkwingsmt approved these changes Oct 26, 2026

View reviewed changes

Merge branch 'main' into checkbox-mark-insets

036f4ae

dkwingsmt added the CICD Run CI/CD label Oct 26, 2026

flutter-dashboard Bot removed the CICD Run CI/CD label Oct 26, 2026

QuncCccccc added the CICD Run CI/CD label Oct 26, 2026

auto-submit Bot merged commit d2e97da into flutter:main Oct 27, 2026
13 checks passed

This was referenced Oct 27, 2026

Roll Packages from 23a05b6ad5d5 to 587ee23a639b (9 revisions) flutter/flutter#195422

Closed

Roll Packages from 23a05b6ad5d5 to a8549ae8080b (10 revisions) flutter/flutter#195434

Merged

		}) : _checkboxType = _CheckboxType.material,
		assert(tristate \|\| value != null);

		}) : _checkboxType = _CheckboxType.adaptive,
		assert(tristate \|\| value != null);

Conversation

Munawer-Ali commented Aug 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Tests

Pre-Review Checklist

Footnotes

Uh oh!

gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

gemini-code-assist Bot Aug 30, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist Bot Aug 30, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist Bot Aug 30, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

elliette commented Sep 1, 2026

Uh oh!

Munawer-Ali commented Sep 2, 2026

Uh oh!

gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

QuncCccccc left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Munawer-Ali commented Sep 4, 2026

Uh oh!

Munawer-Ali commented Sep 9, 2026

Uh oh!

QuncCccccc left a comment

Choose a reason for hiding this comment

Uh oh!

Munawer-Ali commented Sep 14, 2026

Uh oh!

Munawer-Ali commented Sep 18, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

elliette left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Munawer-Ali commented Oct 6, 2026

Uh oh!

Munawer-Ali commented Oct 12, 2026

Uh oh!

Munawer-Ali commented Oct 15, 2026

Uh oh!

Munawer-Ali commented Oct 21, 2026

Uh oh!

Munawer-Ali commented Aug 30, 2026 •

edited

Loading