React Native Reanimated: Reading from `_value` directly is only possible on the UI runtime

Question

Я в своем проекте хочу использовать React Native Reanimated, что бы текст поднимался, когда на поле делается фокус. Пример кода:

const top = useSharedValue(0);
const fontSize = useSharedValue(16);

const animatedStyle = useAnimatedStyle(() => {
    return {
      top: top.value,
      fontSize: fontSize.value,
    };
  });

<Text style={[css.label, animatedStyle]}>{t(label)}</Text>

Сама форма размещена в модалке (react-native-modal). Но я получаю ошибку

Reading from `_value` directly is only possible on the UI runtime

На другом проекте я делаю точно так же и там работает. Отличие - в том проекте форма не в модалке.

Может кто сталкивался и знает как это исправить?

Answer 1

Вот моё решение:

<Animated.View style={[animatedStyle]}>
  //your view
</Animated.View>

Answer 2

Решение здесь очень простое.

Вместо импортирования компонента Animated из react-native, как вы делали, видимо, до этого:

import { Animated } from 'react-native';

нужно импортировать этот компонент непосредственно из react-native-reanimated:

import Animated, { useSharedValue, useAnimatedStyle } from 'react-native-reanimated';

БЛОГ НА HUSL

React Native Reanimated: Reading from `_value` directly is only possible on the UI runtime

Ответы (2 шт):