fix(tab-bar): eliminate duplicate highlight animation on tab press#148
Open
palmtown wants to merge 2 commits intotorgeadelin:masterfrom
Open
fix(tab-bar): eliminate duplicate highlight animation on tab press#148palmtown wants to merge 2 commits intotorgeadelin:masterfrom
palmtown wants to merge 2 commits intotorgeadelin:masterfrom
Conversation
Merge upstream changes from torgeadelin:master into palmtown:master
Previously, tapping a tab would trigger the highlight spring animation twice—once immediately and again from a stale effect—resulting in a rapid “replay.” This change: - Removes all inline `animation(animatedPos).start()` calls from press, long-press, and mount handlers - Introduces a single `useEffect` watching `state.index` - Uses a `useRef` to track the previous index and only fire the spring when the index truly changes - Updates `prevPos` in the spring’s completion callback so the dot always animates from the correct start This ensures a single smooth transition per tab press.
|
Stale pull request message |
|
@palmtown it works for me well. thank you for PR! Simulator.Screen.Recording.-.iPhone.16.Pro.-.2025-10-15.at.11.44.04.mp4 |
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
3 participants
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.
Description:
This pull request fixes a bug where tapping a tab would trigger the highlight spring animation twice—once immediately on press and again from a stale effect—resulting in a rapid “replay.” By consolidating the animation into a single
useEffectand tracking the previous tab index, we ensure the spring only runs once per actual tab change.What’s Changed:
animation(animatedPos).start()calls from:onPressonLongPressuseEffectthat:state.indexuseRef(previousIndex) to detect real index changesanimatedPos.setValue(0)) and then springs to1only when the tab truly changesprevPosin the spring’s completion callback for correct dot positioningSteps to Verify:
Related Issues:
Closes #141 – “Tab highlight animation replays on tab click”