Hello I'm trying to use useAnimatedKayboard() hook from reanimated 2, everything works fine until I click r to reload the project. The app crashes in android and in ios. I'm using it exactly the same as the doc:
function AnimatedKeyboardExample() {
const keyboard = useAnimatedKeyboard();
const translateStyle = useAnimatedStyle(() => {
return {
transform: [{ translateY: -keyboard.height.value }],
};
});
return (
<ScrollView contentContainerStyle={{flex: 1, justifyContent: 'center',
alignItems: 'center' }}>
<Animated.View style={translateStyle}>
<TextInput />
</Animated.View>
</ScrollView>
);
}
Does anyone know how to resolve this?
EDIT: this is a new project in Expo
useAnimatedKeyboard is a Reanimated 3 feature, you're using Reanimated 2, which doesn't have it. The app crashes are most likely from calling the undefined function. If you can upgrade to Reanimated 3, that's probably your quickest solution.
The docs you linked aren't super obvious about it, but they are from the "next" version, which is 3.0. If you click through to the docs from the current release, you'll see it's not in the Hooks section.