Метод out
Метод out класса
Easing
оборачивает другую кривую так, что значение быстро стартует и мягко останавливается у цели.
Синтаксис
easing: Easing.out(Easing.ease)
Параметры
| Параметр | Описание |
|---|---|
кривая |
Исходная функция easing из класса Easing. |
Пример
Давайте сдвинем блок с мягкой остановкой:
import { useEffect, useRef } from 'react';
import { Animated, Easing, View } from 'react-native';
export default function App() {
const shift = useRef(new Animated.Value(0)).current;
useEffect(() => {
Animated.timing(shift, {
toValue: 110,
duration: 550,
easing: Easing.out(Easing.ease),
useNativeDriver: true,
}).start();
}, [shift]);
return (
<Animated.View style={{ transform: [{ translateX: shift }] }}>
<View style={{ width: 42, height: 42, backgroundColor: '#558844' }} />
</Animated.View>
);
}
На экране квадрат резко стартует и плавно замирает у правого края.
