When I try to use the new beta feature “Swap component” using smart animation transition
And fix the scroll position of that component. the animation jump down then up and doesn’t do the smart transition. I know it is still in beta but i want to shout out for feedback
Can you share an example file?
@Gleb I made that prototype to show the case
Expected behaviour
- Click on the red element it will shrink in size and expand keeping the position of the element
What happens - the element jump in the page and come back up again while doing the animation
Figma
Hi everyone, i have found this post after experiencing the same problems with “smart animate” and “fix position when scrolling”. It seems this bug still exist. I have found an “unpolished” solution: use “instant” instead of “smart animate”.
It’s not very nice to see it but it’s better than nothing! 😂
@Agnese_Martinuzzi thanks for the tip.
bug still exists july 2022. leaving a comment so this thread will stay afloat
Agnese_Martinuzzi
Hello iam here to help you
I think your problem is quite common
So here is the fix.
Frame the thing what you have to animate
And resize that as your mainframe size
Do the same on next frame
Your compound = your main frame
Eg: main frame w:270 h:1980
Compound w:270 h:1980
And here you go!
I explained this clearly.
Hope you understand.
Agnese_Martinuzzi
Hello iam here to help you
I think your problem is quite common
So here is the fix.
Frame the thing what you have to animate
And resize that as your mainframe size
Do the same on next frame
Your compound = your main frame
Eg: main frame w:270 h:1980
Compound w:270 h:1980
And here you go!
I explained this clearly.
Hope you understand.
I think I’m having the same problem, though “fix scroll position” does not seem to be an option with smart animate. I’m using a component at the bottom of the frame to simulate tabs, and most of the times I click on a tab, the prototype jumps to the top of the frame for a second, before returning to the tab component. All of the elements repeated between variants of the component have the same labels, and the sizes are the same, so I have no idea what is causing the problem.
I’ve discovered a very simple workaround—simply contain the component in a frame and put the fixed position property on that instead of directly on your component.
works like a charm! Thank you so much 🙏
Aric, I still don’t get it, can you explain in more detail please or someone???! HELP
you’re a genuis. thank you! this bug was driving me crazy.
Nice it works thanks!
@agenaidy you are my hero!!! THANKS!
OMG. This helps me a lot. BIG THANKS
OMG you’re a genius<3
Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.