react-flip-toolkit icon indicating copy to clipboard operation
react-flip-toolkit copied to clipboard

Weird transform matrix generated while combining object-fit and react-flip-toolkit

Open Losses opened this issue 5 years ago • 3 comments

Minimal bug demo: https://codesandbox.io/s/react-flip-toolkit-bugreport-01-09ywo?file=/src/styles.css

The image is not transformed smoothly, with a weird bounce.

Losses avatar Jul 02 '20 02:07 Losses

Thanks for making a demo! I'm sorry to say I don't think react flip toolkit can tween images that change their aspect ratio as part of the transition very well. For a smooth transition I think you need to remove either the height or width params to prevent the aspect ratio from changing: https://codesandbox.io/s/react-flip-toolkit-bugreport-01-3kk9u?file=/src/styles.css (which I understand might not be an ok solution for your use case).

aholachek avatar Jul 02 '20 03:07 aholachek

@aholachek Hi! thanks for you reply! I wonder if react-flip-toolkit can expose an API to let me tune the transform matrix manually based on what is already calculated by the package.

I've found a way to fix the start point and end point of the matrix but can't do anything to apply my fixing solution.

Losses avatar Jul 02 '20 04:07 Losses

It's possible, but probably not something I would be able to work on for the foreseeable future. In case you'd like to look into it a bit more and possibly make a pr, this part of the code would be worth exploring.

aholachek avatar Jul 02 '20 16:07 aholachek