Skip to content

Soften now-playing gradient-to-black seam at the page boundary - #124

Merged
sanylax0 merged 1 commit into
mainfrom
claude/nowplaying-gradient-crossfade
Jul 21, 2026
Merged

sanylax0 merged 1 commit into
mainfrom
claude/nowplaying-gradient-crossfade

Conversation

@sanylax2

Copy link
Copy Markdown
Collaborator

Summary

When paging between the now-playing screen and the Library/Queue (Up Next) pages, the album gradient met the neighbor page's solid systemGroupedBackground (pure black in dark mode) with a hard horizontal line. This was because the scroll crossfade (shipped in #123) darkened the entire backdrop by a single uniform opacity, so mid-scroll a uniformly-dimmed gradient abutted the neighbor's solid background — a crisp step at the page seam.

Fix

NowPlayingBackgroundFade now uses a directional vertical LinearGradient (systemGroupedBackground → clear) that darkens only from the edge abutting the neighbor page inward (top edge when paging toward Library, bottom edge toward Up Next). The backdrop dissolves smoothly into the neighbor's black/white background with no hard line, and at rest (scrollFraction == 1) every stop is clear so the album gradient is untouched. Text/control legibility is preserved (only darkening is added).

Performance

Still an isolated leaf view reading scrollFraction, so the heavy backdrop/now-playing bodies aren't invalidated per scroll frame; no live .blur — consistent with the app's jetsam/memory guardrails.

File changed: App/Continuity/Views/MainPagerView.swift.

Testing

App-target SwiftUI can't be compiled on Linux CI (only ContinuityCore is Linux-testable); validated by review of SwiftUI API + Swift syntax; device verification pending.

Slack thread: https://continuity-org.slack.com/archives/C0BCTF2C5NK/p1784611489906939


Generated by Claude Code

The scroll crossfade darkened the entire now-playing backdrop by a single
uniform opacity, so mid-page the half-darkened gradient met the neighbor
page's solid systemGroupedBackground fill in a crisp horizontal step.

Replace the uniform tint in NowPlayingBackgroundFade with a directional
vertical LinearGradient (systemGroupedBackground -> clear) that dissolves the
backdrop into the neighbor's background only from the abutting edge (top when
paging to Library, bottom when paging to Up Next), ramping smoothly into the
artwork gradient. The page boundary becomes background-on-background (no seam)
and the fall-off is continuous (no crisp line). At rest every stop is clear,
so the full gradient shows untouched. Still a leaf reading scrollFraction, so
the heavy backdrop / now-playing bodies aren't invalidated per frame.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0152PJuDNPYYxd7SDm4TSvbV
@sanylax0
sanylax0 marked this pull request as ready for review July 21, 2026 06:37
@sanylax0
sanylax0 merged commit 865a393 into main Jul 21, 2026
1 of 4 checks passed
@sanylax2

Copy link
Copy Markdown
Collaborator Author

Superseded by #127 — replaced the edge-crossfade with a shared backdrop that bleeds the gradient halfway into the Library/Queue pages per updated design feedback.


Generated by Claude Code

@sanylax2

Copy link
Copy Markdown
Collaborator Author

Correction to the comment above: #124 was already merged into main — its seam fix is shipped, not superseded. #127 is a follow-up that reworks the same now-playing backdrop per updated design feedback (the album gradient now bleeds about halfway into the Library/Queue pages before fading to the flat background). The earlier "superseded" wording was inaccurate.


Generated by Claude Code

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.

3 participants