React Native Headphones Carousel
Run on your device
Snack: https://snack.expo.io/@catalinmiron/react-native-headphones-carousel
Youtube tutorial
I decided to make an advanced #ReactNative animation video tutorial this time. This is an animated carousel / animated slider with lots of animations going on.
In this video tutorial we'll learn how to create:
- text parallax effect
- pagination animation
- clipper/ticker animation with translateY
- circle animation based on active slide index
Built using @expo, vanilla React Native Animated API and FlatList. This code works in plain React Native project as well since we are using only React Native APIs such as Animated and FlatList.
- Inspiration: https://dribbble.com/shots/3894781-Urbanears-Headphones
- GitHub: https://github.com/catalinmiron/react-native-headphones-carousel
- Expo: https://expo.io/
You can find me on:
- Github: http://github.com/catalinmiron
- Twitter: http://twitter.com/mironcatalin
Wanna give me a coffe?
- Paypal: [email protected]
In this video tutorial we'll learn how to create an accordion animation in React Native using Transition API from React Native Reanimated library (https://github.com/software-mansion/react-native-reanimated) and flexbox styling. We will re-create an awesome and colourful animation done by InterfaceMarket.
Inspiration: https://interfacemarket.com/ui-kits/boston-grocery-delivery-app-ui-kit GitHub: https://github.com/catalinmiron/react-native-accordion-menu Reanimated: https://github.com/software-mansion/react-native-reanimated