Skip to content

tab: Fix Pill/Underline double active background on switch animation#2505

Merged
madcodelife merged 2 commits into
mainfrom
tabbar-pill-indicator-double-bg
Jun 24, 2026
Merged

tab: Fix Pill/Underline double active background on switch animation#2505
madcodelife merged 2 commits into
mainfrom
tabbar-pill-indicator-double-bg

Conversation

@madcodelife

Copy link
Copy Markdown
Member

Closes #2499.

Area.mp4

madcodelife and others added 2 commits June 24, 2026 10:49
The sliding indicator is enabled for the `Segmented`, `Pill` and `Underline`
variants, but only `Segmented` made the tab's own active background transparent
while the indicator is shown. For `Pill` (active color lives in the outer `bg`)
and `Underline` (active color is the bottom `border_color`), the newly selected
tab painted its own active color immediately while the indicator was still
sliding in, so the two overlapped during the transition.

Suppress the selected tab's own active background/border once the indicator is
active and ready, so the indicator alone represents the active state during the
slide. Disabled tabs keep their own dimmed styling.

Closes #2499

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
When switching tabs, the newly selected `Pill` tab's text color snapped to
`primary_foreground` instantly while the indicator pill was still sliding into
place, leaving white text floating over the not-yet-filled background.

Animate the selected tab's text color from the normal color to
`primary_foreground` using the same duration and easing as the indicator, keyed
on the indicator's animation epoch so it restarts in sync with each switch. Adds
an `Hsla` implementation of the `Lerp` trait for the color interpolation.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@madcodelife madcodelife merged commit 725dc36 into main Jun 24, 2026
3 checks passed
@madcodelife madcodelife deleted the tabbar-pill-indicator-double-bg branch June 24, 2026 03:00
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.

TabBar: Pill variant shows double background color during tab switching animation

1 participant