I want to animate the movement of the Sprite. My project is more complicated, but I can't even make it work or even think how I could do it on this simple example, when I'm using React components. Basically my goal is on initialization to move some sprites up, some down, but all not just snap them to the desired location, but to animated them smoothly to move to the desired location. Best scenario is if there is any library or property on Pixi.js that I'm missing, that could give me the power to set the transformation of the object (f.e. "x", "y", "rotation") and give it transition like in css.
<Stage width={size.width} height={size.width * (1597 / 2486)}>
<Sprite
image='img/parallax/fog_1.png'
x={0}
y={0}
width={size.width}
height={size.width}
/>
</Stage>
Thank you for any advices.
Okay I did some digging and I found out that GSAP introduced a PIXI plugin, so it is now compatible and you can even use it in React, if you import the useGSAP hook from @gsap/react. Here is the topic where they are showing some of the examples how to use it (without React, but you can easily do it with useRef and useGSAP) Topic with examples