Skip to content

Fix iOS dark appearance backgrounds#27

Closed
Ayobami-00 wants to merge 1 commit into
mainfrom
fix/no-dark-mode
Closed

Fix iOS dark appearance backgrounds#27
Ayobami-00 wants to merge 1 commit into
mainfrom
fix/no-dark-mode

Conversation

@Ayobami-00
Copy link
Copy Markdown
Owner

@Ayobami-00 Ayobami-00 commented May 23, 2026

Summary

Fixes #26.

  • Replaces fixed white iOS launch and Flutter host storyboard backgrounds with an adaptive asset-catalog color that matches Tag light/dark app backgrounds.
  • Adds regression coverage for native iOS dark appearance resources and first-run system dark appearance in Flutter.

Validation

  • flutter analyze
  • flutter test
  • Targeted simulator/E2E check, if relevant
    • flutter build ios --simulator --debug
    • xcrun ibtool --errors --warnings --notices on LaunchScreen.storyboard and Main.storyboard
    • iOS 26 simulator forced to dark appearance; fresh install launched to first-run onboarding. Sanitized proof uploaded to private demo-proof storage for PR 27 attempt 2.

@greptile-apps
Copy link
Copy Markdown

greptile-apps Bot commented May 23, 2026

Greptile Summary

This PR fixes iOS dark mode by replacing hard-coded white backgrounds in LaunchScreen.storyboard and Main.storyboard with a new LaunchBackground named color resolved from a new adaptive asset-catalog colorset (light: #F8F7F2, dark: #0F1115). Regression coverage is added as both a Dart file-system test validating the colorset structure and a Flutter widget test confirming scaffoldBackgroundColor follows the system brightness on first run.

  • Asset catalog (LaunchBackground.colorset/Contents.json): two-entry colorset with correct hex values that exactly match the TagTheme dark/light palette.
  • Storyboard updates: both storyboards switch to name="LaunchBackground", and LaunchScreen.storyboard gains useTraitCollections="YES" so trait-collection dispatch works for the named color.
  • Tests: ios_dark_mode_resources_test.dart checks colorset structure and storyboard content; widget_test.dart adds a dark-appearance scenario with explicit color-value assertions.

Confidence Score: 5/5

Safe to merge — the adaptive color is correctly wired through the asset catalog and both storyboards; the embedded namedColor fallbacks are design-time only and don't affect runtime dark-mode behaviour.

All changed files are iOS resource files and test code. The asset-catalog hex values match the Flutter TagTheme palette exactly. Runtime named-color resolution goes through the asset catalog (which has both variants), so the embedded light-only namedColor in the storyboards is only a design-time concern.

Both storyboard files embed a light-only namedColor fallback; no second look needed for correctness, but IB dark-mode previews will show the wrong colour until the dark appearance entry is added.

Important Files Changed

Filename Overview
ios/Runner/Assets.xcassets/LaunchBackground.colorset/Contents.json New adaptive colorset with light (0xF8F7F2) and dark (0x0F1115) variants — hex values match both the storyboard namedColor fallbacks and the Flutter TagTheme palette exactly.
ios/Runner/Base.lproj/LaunchScreen.storyboard Replaces hard-coded white with name="LaunchBackground" resolved from the asset catalog at runtime; adds useTraitCollections="YES" for trait-collection dispatch. The embedded in resources defines only the light variant, which is a design-time fallback and does not affect runtime dark-mode adaptation.
ios/Runner/Base.lproj/Main.storyboard Same pattern as LaunchScreen — hard-coded calibratedWhite replaced with the named color reference; embedded fallback is light-only. Already had useTraitCollections="YES" so no attribute change needed.
test/ios_dark_mode_resources_test.dart New Dart file-system test validating the colorset structure and absence of hard-coded white in both storyboards. Uses _isDefaultColor/firstWhere pattern consistently, and the helper functions are well-scoped.
test/widget_test.dart Adds a dark-appearance widget test that sets platformBrightnessTestValue before pump, verifies theme.brightness and scaffoldBackgroundColor, and spot-checks two palette colors against constants that match the TagTheme dark palette.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A["iOS system trait collection\n(light / dark)"] --> B{"Asset catalog\nnamed-color lookup\ncolorNamed: LaunchBackground"}
    B -->|light| C["#F8F7F2\n(warm off-white)"]
    B -->|dark| D["#0F1115\n(near-black)"]
    C --> E["LaunchScreen.storyboard\nbackgroundColor"]
    D --> E
    C --> F["Main.storyboard\n(Flutter host VC)\nbackgroundColor"]
    D --> F
    E --> G["Launch screen rendered\nby iOS before app code"]
    F --> H["Flutter engine\nmounts on top"]
    I["Storyboard namedColor\nin resources section"] -.->|IB design-time\nfallback only\nlight variant only| E
    I -.->|IB design-time\nfallback only\nlight variant only| F
Loading

Reviews (2): Last reviewed commit: "Fix iOS dark appearance backgrounds" | Re-trigger Greptile

Comment thread test/ios_dark_mode_resources_test.dart Outdated
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant