Open mrousavy opened 7 months ago
mrousavy
commented
7 months ago Okay - just created a minimal reproduction! I just updated the "[SET] Custom transition" example in the Reanimated playground in my branch here: https://github.com/mrousavy/react-native-reanimated/tree/repro/shared-element-transition-bugs
Laityned
commented
4 days ago As an addition, I noticed that transformations applied to any parent element are also not taking into account. Therefore, transistion is happening from its original location and not from his current location
Description
Hey all!
I've noticed a small bug in Shared Element Transitions, where the Animation does not take the current scale into account. See this video recording:
https://github.com/software-mansion/react-native-reanimated/assets/15199031/da40c895-ed5b-4d65-87ad-b7d030b362af
You might want to watch this in QuickTime and go through this frame by frame - but as you can see I drag down the view to this scale:
...where it should start animating from. If we go to the next frame, we can see that the animation does not start at that scaled down state, but rather at the original scale:
...and then just scales down from that to it's target position.
It does work for the translation (it starts at the correct originY and originY), but not for scale. Both translation and scale are passed in the same parent view's style.
Steps to reproduce
Snack or a link to a repository
https://github.com/mrousavy/react-native-reanimated/tree/repro/shared-element-transition-bugs
Reanimated version
3.6.1
React Native version
0.72.7
Platforms
iOS
JavaScript runtime
Hermes
Workflow
React Native
Architecture
Paper (Old Architecture)
Build type
Debug app & dev bundle
Device
Real device
Device model
iPhone 11 Pro
Acknowledgements
Yes