Метод elastic
Метод elastic класса
Easing
принимает число, которое задает силу колебания.
Результат передают в easing у
timing.
Синтаксис
easing: Easing.elastic(1)
Параметры
| Параметр | Описание |
|---|---|
число |
Амплитуда пружины: большее значение дает сильнее колебание у цели. |
Пример
Давайте увеличим блок с elastic:
import { useEffect, useRef } from 'react';
import { Animated, Easing, View, Text } from 'react-native';
export default function App() {
const scale = useRef(new Animated.Value(0.3)).current;
useEffect(() => {
Animated.timing(scale, {
toValue: 1,
duration: 800,
easing: Easing.elastic(1.2),
useNativeDriver: true,
}).start();
}, [scale]);
return (
<Animated.View style={{ transform: [{ scale }] }}>
<Text>abcde</Text>
</Animated.View>
);
}
На экране текст подрастает и слегка перекачивается вокруг полного размера.