Skip to content

Add real-time accent color clipping to glass indicator#3

Open
ryanashcraft wants to merge 9 commits intomainfrom
selection-mask
Open

Add real-time accent color clipping to glass indicator#3
ryanashcraft wants to merge 9 commits intomainfrom
selection-mask

Conversation

@ryanashcraft
Copy link
Owner

@ryanashcraft ryanashcraft commented Feb 25, 2026

Track the glass indicator's animated position via CADisplayLink and mask accent-colored content views to it, matching native UITabBar clipping behavior during drag.

WireView Screenshot 2026-02-24 at 9 29 11 PM

ryanashcraft and others added 3 commits February 24, 2026 21:13
Replace discrete per-index color switching with continuous accent masking
that tracks the glass indicator's animated position. Each segment now has
two content views (base inactive + accent active), with the accent view
masked to the indicator rect via CAShapeLayer — matching native UITabBar
clipping behavior during drag.

Key changes:
- Track _UILiquidLensView presentation layer position via CADisplayLink
- Structural fallback finds indicator as sibling of segments container
- Segment-frame fallback with diagnostic log if indicator not found
- DisplayLinkProxy avoids CADisplayLink retain cycle
- Display link pauses after 3 stable frames to save power
- Presentation-layer coordinate conversion on both sides
- Fix retain cycle in onReselect closure with [weak coordinator]

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Add 1.1.0 changelog entry for real-time accent color clipping.
Remove "Color clipping during drag" from known limitations since
it's now been addressed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
ryanashcraft and others added 6 commits February 24, 2026 21:15
Fixes accent mask getting stuck when user pauses mid-drag then
resumes. The display link would pause after 3 stable frames and
never restart because only touchesBegan unpaused it.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Mask the base (inactive) content view with the inverse of the indicator
rect so the two layers never overlap. Previously both rendered at the
mask boundary, causing the inactive color to bleed through due to
antialiasing.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Ensures accent masks track the indicator's settle animation after
the user lifts their finger or the touch is cancelled.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Replace rectangular mask paths with rounded rect using cornerRadius
of height/2, matching the capsule shape of the glass indicator.
Converts the full indicator capsule into local coordinates so
rounded corners are preserved even during partial overlap.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@saschagordner
Copy link

This is great! Excited to see what you will come up with for the overlapping items. 😝

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.

2 participants