Victor Sanni 6b73de27bd
Improve CupertinoRadio fidelity (#149703)
Adds the following:

*  Darkens when pressed in light mode
*  Lightens when pressed in dark mode.
* Tests that confirm `CupertinoRadio` is focusable and has correct focus
colors
* Tests that confirm `CupertinoRadio` uses correct default
active/inactive/fill colors
* Same look in disabled vs. enabled states as native macOS:

| Native macOS | Flutter Before | Flutter After | 
--- | --- | --- |
| <img width="50" alt="radio native"
src="https://github.com/flutter/flutter/assets/77553258/27c8c27e-f0dc-4ad7-a8c2-361ae8b437bb">
| <img width="50" alt="flutter radio before"
src="https://github.com/flutter/flutter/assets/77553258/580d9c4b-0f0d-457e-851f-73450738ee16">
| <img width="50" alt="flutter radio after"
src="https://github.com/flutter/flutter/assets/77553258/da6ae21b-87f8-45d8-a2d2-da70ff4853a1">
|

* Same look of an unselected radio button in dark mode as native macOS:

| Native light mode | Flutter before light mode | Flutter after light
mode | Native dark mode | Flutter before dark mode | Flutter after dark
mode
--- | --- | --- | --- | --- | --- |
| <img width="23" alt="native radio light"
src="https://github.com/flutter/flutter/assets/77553258/b52fc18b-e10d-4205-b10b-1536fbbf1ca0">
| <img width="23" alt="flutter radio after light"
src="https://github.com/flutter/flutter/assets/77553258/54294523-8254-479c-b668-77927a8295f1">
| <img width="23" alt="flutter radio light"
src="https://github.com/flutter/flutter/assets/77553258/8472deee-e5ce-4d39-9207-d788ad7f34f4">
| <img width="23" alt="native radio dark"
src="https://github.com/flutter/flutter/assets/77553258/44143099-6ab4-4fb8-8a94-ebb1386022c9">
| <img width="23" alt="flutter radio before dark"
src="https://github.com/flutter/flutter/assets/77553258/3411d9fb-fc7f-4b20-86a5-34fda167d5b9">
| <img width="23" alt="flutter radio dark"
src="https://github.com/flutter/flutter/assets/77553258/39ea3649-142e-43ad-9681-24e1216e0987">
|

## Light mode (with focus highlight)
| Native light mode | Flutter before light mode | Flutter after light
mode |
--- | --- | --- | 
| <img width="70" alt="native radio light mode"
src="https://github.com/user-attachments/assets/914b9f1f-5819-4c5b-8739-8498a72b337f">
| <img width="70" alt="radio flutter focus before"
src="https://github.com/user-attachments/assets/3129fca3-3310-4b2b-bcf3-98aa8f049911">
| <img width="70" alt="radio flutter focus after"
src="https://github.com/user-attachments/assets/7a2089d9-b2b5-4ff0-9db9-444455301146">
|

## Dark mode
| Native dark mode | Flutter before dark mode | Flutter after dark mode
|
--- | --- | --- | 
| <img width="70" alt="native radio dark mode"
src="https://github.com/user-attachments/assets/4da3c055-ce89-4f37-8fcd-d4cbbc4031a0">
| <img width="70" alt="flutter before radio dark mode"
src="https://github.com/user-attachments/assets/36b5f36a-f1d9-4c32-8493-3533a749cf5d">
| <img width="70" alt="flutter radio dark mode after"
src="https://github.com/user-attachments/assets/28828e01-bb2f-4217-9756-2766be3919a6">
|

## Disabled light mode
| Native | Flutter before | Flutter after | 
--- | --- | --- | 
| <img width="120" alt="light disabled radio native"
src="https://github.com/user-attachments/assets/bf6d2561-5dcf-4882-afac-6b639fa949b0">
| <img width="120" alt="Screenshot 2024-07-30 at 3 13 30 PM"
src="https://github.com/user-attachments/assets/3efc978c-fa58-44e8-877a-ea29778ea384">
| <img width="120" alt="light disabled radio flutter after"
src="https://github.com/user-attachments/assets/b2c2e30a-cb8d-40d0-aa6f-75a98caa4829">
|

## Disabled dark mode
| Native | Flutter before | Flutter after | 
--- | --- | --- | 
| <img width="120" alt="dark disabled radio native"
src="https://github.com/user-attachments/assets/feedccc7-9802-4b0c-8038-c9eb771b0eb0">
| <img width="120" alt="Screenshot 2024-07-30 at 3 13 30 PM"
src="https://github.com/user-attachments/assets/6d2f03f7-7216-4850-8c4f-f79ae05bb9da">
| <img width="136" alt="dark disabled radio flutter after"
src="https://github.com/user-attachments/assets/5e03d4fc-4b8e-4518-b429-6bb58f6d988d">
|

`CupertinoRadio` is missing a tristate/mixed state, but [Apple's latest
HIG specs discourages its
use](https://developer.apple.com/design/human-interface-guidelines/toggles#Radio-buttons).

Fixes https://github.com/flutter/flutter/issues/151994

## Pre-launch Checklist

- [x] I read the [Contributor Guide] and followed the process outlined
there for submitting PRs.
- [x] I read the [Tree Hygiene] wiki page, which explains my
responsibilities.
- [x] I read and followed the [Flutter Style Guide], including [Features
we expect every widget to implement].
- [x] I signed the [CLA].
- [x] I listed at least one issue that this PR fixes in the description
above.
- [x] I updated/added relevant documentation (doc comments with `///`).
- [x] I added new tests to check the change I am making, or this PR is
[test-exempt].
- [x] 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].

<!-- Links -->
[Contributor Guide]:
https://github.com/flutter/flutter/wiki/Tree-hygiene#overview
[Tree Hygiene]: https://github.com/flutter/flutter/wiki/Tree-hygiene
[test-exempt]:
https://github.com/flutter/flutter/wiki/Tree-hygiene#tests
[Flutter Style Guide]:
https://github.com/flutter/flutter/wiki/Style-guide-for-Flutter-repo
[Features we expect every widget to implement]:
https://github.com/flutter/flutter/wiki/Style-guide-for-Flutter-repo#features-we-expect-every-widget-to-implement
[CLA]: https://cla.developers.google.com/
[flutter/tests]: https://github.com/flutter/tests
[breaking change policy]:
https://github.com/flutter/flutter/wiki/Tree-hygiene#handling-breaking-changes
[Discord]: https://github.com/flutter/flutter/wiki/Chat
[Data Driven Fixes]:
https://github.com/flutter/flutter/wiki/Data-driven-Fixes

---------

Co-authored-by: Kate Lovett <katelovett@google.com>
2024-08-02 18:32:17 -07:00
..