Skip to content

Skip EdgeAnim's default layout transition on Android - #6302

Closed
peachbits wants to merge 1 commit into
developfrom
matthew/android-edgeanim-layout
Closed

peachbits wants to merge 1 commit into
developfrom
matthew/android-edgeanim-layout

Conversation

@peachbits

Copy link
Copy Markdown
Contributor

Description

On Android, Home's promo card sometimes draws over the Buy and Sell tiles. Home lays out its rows before the promo carousel appears. When it appears above them, the rows should move down, but on slow, loaded startups they stay where they were, so the carousel and the Buy/Sell row share the same space. The rows below shift up by the same amount.

Every EdgeAnim gets a default Reanimated layout transition (LinearTransition), and on Android under the new architecture that transition sometimes leaves a view at its old position. Measured from view bounds on cold launches of a large account on an API 35 emulator:

Build Launches with the overlap
develop 3 of 10
Reanimated commit pausing turned back on 2 of 3
No default layout transition 0 of 9

A carousel delayed by 4 s did not reproduce it, so the trigger looks like the carousel landing while the rows' entering animations are still running.

This drops the default layout transition on Android only. Callers that pass layout explicitly are unchanged, and iOS keeps the default. About 95 of the 105 EdgeAnim uses rely on that default, so on Android their position changes become instant instead of animated.

CHANGELOG

Does this branch warrant an entry to the CHANGELOG?

  • Yes
  • No

Dependencies

none

Requirements

If you have made any visual changes to the GUI. Make sure you have:

  • Tested on iOS device
  • Tested on Android device
  • Tested on small-screen device (iPod Touch)
  • Tested on large-screen device (tablet)

On Android under the new architecture, Reanimated's layout transition
sometimes leaves a view at its old position after its siblings change.
On slow, loaded startups, Home's rows stayed where they were before the
promo card appeared above them, so the card drew over the Buy and Sell
tiles. Over cold launches of a large account on an emulator, this
happened on 3 of 10 launches with the transition and 0 of 9 without it.
Turning Reanimated's commit pausing back on did not help.

iOS keeps the default; this was only seen on Android.
@peachbits

Copy link
Copy Markdown
Contributor Author

Closing in favor of #6298, which takes over this fix and addresses the cause instead of dropping EdgeAnim's default layout transition on Android.

The overlap comes from a Reanimated 4.5 bug. The legacy layout-animation proxy drops each layout animation's last frame once it settles, so views stop one frame short of their target. On a busy device the first frame can be the last one, and the view stays where it started, so Home's rows never move down below the promo carousel. Upstream fixed it in Reanimated 4.6.0 (upstream PR 10171). The reworked #6298 upgrades to Reanimated 4.5.5 and backports that fix with patch-package, which covers both platforms.

On an Android emulator with the carousel forced in 4 s late, the Buy tile now lands on its target on 6 of 6 launches (1 px short on 4 of 4 before). Cold launches under CPU load showed no overlap (0 of 8).

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