목록react-native-animatable (1)

뇌 채우기 공간

[React-Native] react native navigation animation/ reanimated / react-native-animatable/ 리액트 네이티브 페이지 전환 애니메이션, 요소 애니메이션 사용법 위주

결과 화면을 먼저 봅시다. (참고로 이것은 실제 서비스 하는 코드와 화면이 아님) 애니메이션을 적용한 곳은 1. 리스트 페이지에서 디테일 페이지로 이동할 때 사진이 그 자리에서 커지면서 이동하고 디테일 페이지에서 리스트 페이지로 넘어갈때 작아지면서 그 자리를 찾아간다. 2. 디테일 페이지 진입 시에 이미지 하단 부분이 뿅 하고 나오는 형태 3. 이미지 하단 썸네일들이 뾰로롱 순서대로 등장함 4. 찜하기를 눌렀을 때 별이 띠용띠용 커졌다가 줄어듦 이렇게 적용했습니다. 각자에 적용한 라이브러리들이 다릅니다. 하나씩 소개하겠습니다. 1. React-navigation-shared-element https://github.com/IjzerenHein/react-navigation-shared-element 네비..
TIL 2022. 10. 14. 18:02
이전 Prev 1 Next 다음