Метод reset
Метод reset вызывают у объекта анимации, который вернули методы класса
Animated.
После сброса тот же объект можно снова передать в
start.
Статического Animated.reset нет.
Синтаксис
const anim = Animated.timing(value, { toValue: 1, duration: 300, useNativeDriver: true });
anim.start();
anim.reset();
Пример
Давайте после цикла сбросим анимацию и запустим снова:
import { useRef } from 'react';
import { Animated, View, Pressable, Text } from 'react-native';
export default function App() {
const scale = useRef(new Animated.Value(1)).current;
const animRef = useRef(null);
const build = () => {
return Animated.sequence([
Animated.timing(scale, {
toValue: 1.4,
duration: 200,
useNativeDriver: true,
}),
Animated.timing(scale, {
toValue: 1,
duration: 200,
useNativeDriver: true,
}),
]);
};
const run = () => {
if (!animRef.current) {
animRef.current = build();
}
animRef.current.start(({ finished }) => {
if (finished) {
animRef.current.reset();
}
});
};
return (
<View>
<Pressable onPress={run}>
<Text>abcde</Text>
</Pressable>
<Animated.View style={{ transform: [{ scale }] }}>
<View style={{ width: 50, height: 50, backgroundColor: '#3366cc' }} />
</Animated.View>
</View>
);
}
На экране квадрат пульсирует при каждом нажатии, потому что объект анимации сбрасывается после цикла.
