Gazfay/react-native-snippets

React Native code snippets

react-native-snippets

React Native code snippets. Simple code templates for future tasks.

Victory Native Chart

library: https://www.npmjs.com/package/victory-native

code: https://github.com/Gazfay/react-native-snippets/blob/main/src/components/VictoryNative/index.tsx

Demo

Custom Chart Slices

library: https://www.npmjs.com/package/react-native-svg

code: https://github.com/Gazfay/react-native-snippets/blob/main/src/components/CustomChart/index.tsx

Demo

Reanimated Header

library: https://www.npmjs.com/package/react-native-reanimated

code: https://github.com/Gazfay/react-native-snippets/blob/main/src/components/AnimatedHeader/index.tsx

Demo

Custom swiper

libraries:

• https://www.npmjs.com/package/react-native-reanimated
• https://www.npmjs.com/package/react-native-gesture-handler

code: https://github.com/Gazfay/react-native-snippets/blob/main/src/components/Swipe/index.tsx

Demo

Custom Circle Slider

libraries:

• https://www.npmjs.com/package/react-native-reanimated
• https://www.npmjs.com/package/react-native-gesture-handler
• https://www.npmjs.com/package/react-native-svg

code: https://github.com/Gazfay/react-native-snippets/blob/main/src/components/CircleSlider/index.tsx

Demo

Custom Progress Circle

libraries:

• https://www.npmjs.com/package/react-native-reanimated
• https://www.npmjs.com/package/react-native-svg

code: https://github.com/Gazfay/react-native-snippets/blob/main/src/components/ProgressCircle/index.tsx

Demo