[TIL] 리액트 네이티브 스크롤 페이지 전환 애니메이션

수평으로 된 ScrollView에 scroll에 따른 페이지 전환 애니메이션을 작업했다.

(정리 ver)

const scrollX = useRef(new Animated.Value(0));

...


<ScrollView
    horizontal={true} // 가로 모드
    pagingEnabled // true인 경우 스크롤할 때 스크롤 보기가 스크롤 보기 크기의 배수에서 멈춥니다. 수평 페이지 매김에 사용할 수 있습니다.
    showsHorizontalScrollIndicator={false} //  스크롤 표시 기능
    onScroll={Animated.event(
      [
        {
          nativeEvent: {
            contentOffset: {
              x: scrollX.current,
            },
          },
        },
      ],
      { useNativeDriver: false }, // React Native Error: "Animated.event now requires a second argument for options" 오류 메시지를 없애기 위해
    )}
    scrollEventThrottle={16}> //  ios 성능에 영향을 끼친다고 안내되어있음

함수의 가운데 부분 좀더 공부가 필요

마지막 페이지가 screen with보다 작으면 ios는 잘 넘어가는데 android는 잘 안넘어가는 문제가 있음