Custom React Native Picker - Reanimated

A custom React Native Picker that is animated using React Native Reanimated, written in TypeScript. The picker uses FlatList under the hood to perform the scrolling and rendering of the elements, as well as a small algorithm to measure items and find the snap points. This picker supports dynamic sizes for the elements and it will snap into position based on scroll x position. When "idle" the rest of the elements are hidden using an animation except the active one, and while "active" the items becomes visible. When the previous value has changed, there's a haptic applied so that it will inform users the value has changed.

react native reanimated

react native animation

react native picker

react native custom picker

react native animated picker