Skip to content

fix: make LayoutAnimation.configureNext work alongside Reanimated layout animations#9900

Closed
tomekzaw wants to merge 1 commit into
mainfrom
@tomekzaw/layout-animation-configure-next-compat
Closed

fix: make LayoutAnimation.configureNext work alongside Reanimated layout animations#9900
tomekzaw wants to merge 1 commit into
mainfrom
@tomekzaw/layout-animation-configure-next-compat

Conversation

@tomekzaw

@tomekzaw tomekzaw commented Jul 7, 2026

Copy link
Copy Markdown
Member

Summary

With Reanimated installed, React Native's LayoutAnimation.configureNext silently does nothing and its success callback never fires. Reanimated takes over UIManager's single animation delegate slot (it needs the stopSurface callback) and stubs out the remaining UIManagerAnimationDelegate methods, so the config is swallowed and the animation tick path is dead.

This PR makes both layout animation systems work together, with no changes to React Native:

  • Reanimated creates its own instance of core's LayoutAnimationDriver and forwards the UIManagerAnimationDelegate calls to it (config delivery, shouldAnimateFrame, stopSurface).
  • The driver is registered as an additional chained MountingOverrideDelegate (supported since RN 0.75) ahead of the Reanimated proxy, so the proxy passes the driver's interpolated mutations through as regular unregistered-tag mutations.
  • Frames are driven from Reanimated's existing requestRender loop (not UIManager::animationTick, which would also tick NativeAnimated).

Side effect: on Android, configureNext now works with Reanimated installed even though stock RN gates it behind enableLayoutAnimationsOnAndroid (default off).

Known limitation: a view driven by both systems in the same commit double-animates for that commit — use one system per view.

Test plan

Open the new example: fabric-example → [LA] LayoutAnimation.configureNext compatibility (iOS and Android).

  • Tap "configureNext + toggle": the box animates to its new position (previously it snapped) and the success callback counter increments (previously it never fired).
  • Toggle the Reanimated view: FadeIn/FadeOut/LinearTransition still work, also while a configureNext animation is in flight.
  • Rapidly tap "configureNext + toggle" several times: interrupted animations settle correctly and every callback fires.
  • Restart the app: no crash on teardown; existing layout animation examples (e.g. Basic layout animation) behave as before.

🤖 Generated with Claude Code

…out animations

Reanimated takes over UIManager's single animation delegate slot (needed
to receive stopSurface) and swallowed uiManagerDidConfigureNextLayoutAnimation,
so React Native's LayoutAnimation.configureNext silently did nothing and its
success callback never fired.

Reanimated now owns an instance of core's LayoutAnimationDriver, forwards
the UIManagerAnimationDelegate calls to it, registers it as an additional
chained MountingOverrideDelegate ahead of the Reanimated proxy, and drives
its frames from the existing requestRender loop.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@tomekzaw

tomekzaw commented Jul 9, 2026

Copy link
Copy Markdown
Member Author

See #9901.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant