feat!: match the 2026 iOS, Android and Chrome settings look - #209
Merged
Merged
Conversation
Measured against iOS 27 (simulator), Android 17 (Pixel 10) and Chrome 153: - iOS/macOS/Windows: 26pt continuous-corner cards, 20pt margins, 52pt rows with 17pt text, 17pt semibold section headers, secondary grey - Android/Linux/Fuchsia: each tile on its own card (20dp group ends, 4dp inner corners, 2dp gaps) on a surfaceContainer page, 16sp titles, tighter rows, check/cross switch thumbs - Web: white 8px cards with a light shadow, 14/13px text, 20px icons, chevrons on navigation tiles, near-black section titles, 680px column Adds tests for the new layout and updates the README screenshots and the example's iOS headers to sentence case. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Adds CupertinoSettingsSwitch, a pure-Flutter copy of the iOS 26/27 UISwitch, measured on the iOS 27 simulator, and uses it in iOS-style switch tiles instead of CupertinoSwitch. - Rest: 63x28 continuous-corner track, 37x24 white pill thumb, 2pt inset, 22pt travel. OFF #C5C5C7/#5A5A5E, ON system green. - Pressed or dragged: the thumb springs into a 59.33x39.67 glass lens that overflows the track. It is painted with a CustomPainter only: a squeezed, lifted track image with flares, refracted bands, a hairline rim, a specular line and a soft shadow below. - Motion: spring press with a small overshoot, frosted phases, and a tinted thumb that fades to white after release. Drags follow the finger with rubber-banding and flip the value 1pt past the far end. Reduced motion skips the lens. - Horizontal drags only, so lists still scroll. Light haptic on iOS and macOS. Toggle semantics, keyboard activation, 50% opacity when disabled. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
flutter create picked up an unrelated development team when the iOS runner was regenerated. Leave it unset so contributors choose their own team in Xcode. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Contributor
Author
|
Merged via #210 and released in 4.0.0. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Updates all three styles to match the real 2026 settings apps, measured from screenshots of iOS 27 (simulator), Android 17 (Pixel 10) and Chrome 153. Every supported platform uses one of these styles: iOS/macOS/Windows → Cupertino, Android/Linux/Fuchsia → Material, web → Chrome.
iOS / macOS / Windows
ClipRSuperellipse), 20pt side marginsCupertinoSettingsSwitchmatching the iOS 26/27 switch: 63x28 track, 37x24 pill knob, and a Liquid Glass-style lens (59x40) while pressed or dragged. Drawn with aCustomPainter(no shaders, platform views or backdrop filters), measured against the real UISwitch on an iOS 27 simulator. ReplacesCupertinoSwitchin iOS-style switch tiles.Android / Linux / Fuchsia
surfaceContainerpage withsurfaceBright(light) /surfaceContainerHighest(dark) cardsWeb
Colors set in
SettingsThemeDatastill win. The example's iOS project no longer hard-codes a signing team. The CHANGELOG notes this as a breaking visual change for 4.0.0. README screenshots are updated, and the example's iOS headers are now sentence case.Testing
🤖 Generated with Claude Code