material-components / material-components/material-components-android
[MaterialCheckBox] Unchecked outline color does not match M3 specs when pressed, focused, hovered
Nobody has claimed this yet.
- Dominant language
- Java
- Stars
- 17.4k
- Forks
- 3.2k
- PR merge metrics
- No merged PRs in 30d
Description
**Description:** According to the M3 specs, the outline color should be `colorOnSurfaceVariant` when unchecked, and `colorOnSurface` when pressed, focused, or hovered. Currently MDC always uses `colorOnSurfaceVariant`.
This bug exists in both `MaterialCheckBox` and `MaterialRadioButton`, they will use the same coloring.
**Expected behavior:** Use `colorOnSurface` when `unchecked && (pressed || focused || hovered)`.
**Source code:**
In CheckBox, MDC has only unchecked state color, and the colors in the other three states are missing.
https://github.com/material-components/material-components-android/blob/1dc3923bf7688d3a40510faf666517ebac1439b2/lib/java/com/google/android/material/checkbox/res/color/m3_checkbox_button_tint.xml#L32-L34
In RadioButton, the other three colors are defined, but should be declared as `android:state_checked="false"` instead of `true`.
https://github.com/material-components/material-components-android/blob/1dc3923bf7688d3a40510faf666517ebac1439b2/lib/java/com/google/android/material/radiobutton/res/color/m3_radiobutton_button_tint.xml#L36-L44
**Material Library version:** 1.13.0-alpha13
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with lib/java/com/google/android/material/checkbox/res/color/m3_checkbox_button_tint.xml and lib/java/com/google/android/material/radiobutton/res/color/m3_radiobutton_button_tint.xml at the referenced state definitions. Compare the unchecked pressed, focused, and hovered selectors with the M3 specification. Done means both MaterialCheckBox and MaterialRadioButton use colorOnSurface for those unchecked interaction states and colorOnSurfaceVariant otherwise.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- android
- Domain
- design, mobile
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 50/100