31 lines
856 B
TypeScript
31 lines
856 B
TypeScript
import React, { FC, useEffect, useRef, useState } from "react";
|
|
import LottieView from "lottie-react-native";
|
|
|
|
type Props = {
|
|
progress: number;
|
|
};
|
|
export const LottieDelayView: FC<Props> = ({ progress }) => {
|
|
const lottieRef = useRef<LottieView>();
|
|
const [progressState, setProgressState] = useState(undefined);
|
|
useEffect(() => {
|
|
if (progress == 0) {
|
|
lottieRef.current.play(progressState !== undefined ? 35 : 7, 7);
|
|
} else {
|
|
lottieRef.current.play(progressState !== undefined ? 7 : 35, 35);
|
|
}
|
|
}, [progress]);
|
|
return (
|
|
<LottieView
|
|
progress={progressState}
|
|
speed={1.4}
|
|
style={{ width: 80, height: 80 }}
|
|
loop={false}
|
|
source={require("../../assets/939-star.json")}
|
|
ref={lottieRef}
|
|
onAnimationFinish={(isCanceled) => {
|
|
setProgressState(progress);
|
|
}}
|
|
/>
|
|
);
|
|
};
|