What's Included
- TypeScript source (CircularFlatlist.tsx + CircularFlatlistItem.tsx)
- Synced detail card component (SkinStatusCard.tsx)
- Demo screen with sample data
- Sample PNG image assets
- README with install + usage
About the Project
Built with react-native-reanimated v4 and react-native-worklets. A useAnimatedScrollHandler keeps the live scroll offset in a shared value, and each item interpolates that offset on the UI thread: translateY follows a circular arc (Math.sin(PI/4) for the off-center points), while opacity, scale, and a blurRadius animated prop on Animated.Image make the centered item pop and the edges recede. Snapping uses pagingEnabled + snapToInterval, and selection haptics fire via expo-haptics through runOnJS so the JS-thread call never blocks the worklet. Tested on Expo SDK 56 (RN 0.85, New Architecture). The animated blurRadius renders more smoothly on iOS than Android; transparent source PNGs keep the blur following the artwork rather than a hard rectangle.
