import React, { useRef } from 'react';
import { Animated } from 'react-native';
import { event } from "react-native-reanimated";

const Screen = () => {
  const scrollY = useRef(new Animated.Value(0)).current;
  const opacity = scrollY.interpolate({
    inputRange: [0, 60, 90],
    outputRange: [1, 0, 0],
    extrapolate: 'clamp',
  });
  
  return (
    <View>
      <StickyParallaxHeader
    	...
        scrollEvent={event([{ nativeEvent: { contentOffset: { y: scrollY } } }], { useNativeDriver: false })}
        ...
        >
        ...
      </StickyParallaxHeader>
      ...
    </View>
  );
};

React Native에서 Animated를 사용할 때 주의할 점은 같은 패키지에서 클래스나 함수가 import 되는지 확인해야한다. 지금 위의 코드의 풀버전은 vscode에서 문법적 오류가 존재하지 않는다. 그런데 라이브러리의 예시 코드를 복붙해도 계속 null is not an object 에러가 뜨길래 뭐지싶어서 계속 구글링했는데 답을 찾을 수 없었다. (해결하고보니 답이었던 sof comment가 떠오르긴 한다.) 그래서 혹시나 싶어서 지금 react-native-reanimated에서 import한 event를 react-native의 Animated.event로 바꿔보니까 바로 문제가 해결되었다.

결론

React Native에서 Animated 사용할 때 원인을 알 수 없는 에러가 발생한다면, 동일한 패키지에서 import하고 있는지 체크해본다.