Arc carousel - Reanimated
Description
A simple, reusable, Arc carousel component build with React Native Reanimated. This component implements the same `FlatList` API with some additional properties that you can pass. In case you want to customize it, please review the code from `index.tsx` and refactor to meet your needs.
There is an additional `Pagination` component that I've added just this example but you can remove it if not needed.
The angle of the items is calculated based on the item `index` and it's using `Math.atan2` to get the angle between the `middle` element on `y` axis and `left edge` of the screen for `x` axis.
This assumes that the `middle` element is the active one. Additionally we could have used a real angle calculation by getting it from the actual `y` position of the element and the `middle` screen position as intersection.
Installation
bunx @animatereactnative/cli@latest add arc-carousel-reanimated
npx @animatereactnative/cli@latest add arc-carousel-reanimated
yarn @animatereactnative/cli@latest add arc-carousel-reanimated
pnpm dlx @animatereactnative/cli@latest add arc-carousel-reanimated