Estoy siguiendo este video https://www.youtube.com/watch?v=OU43e7TwlEY y todo está bien y todo funciona, pero me gustaría hacer que esta animación sea continua sin necesidad de reproducirla en animación inversa .
Partes de mi código se ven así
useEffect(() => { progress.value = withRepeat( withTiming(1, { duration: 3000, easing: Easing.inOut(Easing.ease), }), -1, false ); }, [progress]); const data = useDerivedValue(() => { const m = mix.bind(null, progress.value); return { from: { x: m(0, -0.05), y: m(0.2, 0.25), }, c1: { x: m(0.3, 0.35), y: m(0, 0.05) }, c2: { x: m(0.8, 0.85), y: m(0.5, 0.45) }, to: { x: m(1, 1.05), y: m(0.25, 0.2) }, }; }); const path = useAnimatedProps(() => { const { from, c1, c2, to } = data.value; return { d: `M ${from.x} ${from.y} C ${c1.x} ${c1.y} ${c2.x} ${c2.y} ${to.x} ${to.y} L 1 1 L 0 1 Z`, }; });Como puede ver, las coordenadas desde x van de 0 a -0.05, pero no puedo agregar la tercera coordenada 0 (por lo que sería 0 → -0.05 → 0, por ejemplo, lo que lo haría continuo). Lo mismo debería ser para cualquier otro punto.
¿Algunas ideas? Cualquier comentario sería apreciado. Gracias.