Skip to content

This is animation practices repo for React Native

Notifications You must be signed in to change notification settings

shubh435/RNAnimation

Repository files navigation

React Native Animation – Apple Invites Carousel

A simple and clean React Native project demonstrating smooth, Apple-style invitation carousel animations. This repo is perfect for anyone who wants to learn gesture-based animations, shared transitions, and carousel effects using React Native.

https://github.com/shubh435/RNAnimation


🚀 Features

  • Apple-style invitation carousel animation
  • Smooth transitions powered by React Native Reanimated
  • Gesture-driven scroll & snap behavior
  • 60fps-smooth animations
  • Minimal, easy-to-read code structure
  • Works on both iOS and Android

📦 Tech Stack

  • React Native
  • React Native Reanimated
  • React Native Gesture Handler
  • TypeScript (optional depending on your repo)

🛠️ Installation & Setup

Follow the steps below to run the project locally:

# Clone the repo
git clone https://github.com/shubh435/RNAnimation.git

# Navigate into project
cd RNAnimation

# Install dependencies
yarn

# Run on Android
yarn android

# Run on iOS (Mac only)
yarn ios

📸 Demo Preview

(Coming soon)


📁 Project Structure

RNAnimation/
│── src/
│    ├── components/
│    ├── screens/
│    ├── animations/
│    └── utils/
│── assets/
│── App.js
│── README.md

🧩 How It Works

The carousel animation uses:

✔️ useSharedValue

To keep animated states in sync.

✔️ interpolate / useAnimatedStyle

To animate scaling & opacity of cards while scrolling.

✔️ PanGestureHandler

To detect swipe gesture and trigger snapping behavior.

If you need an "Animation Logic" section with code comments, I can generate that too.


👨‍💻 Author

Shubham Sarode GitHub: https://github.com/shubh435 Portfolio: https://shubh435.github.io/


🤝 Contributing

PRs are welcome! If you'd like improvements (extended animations, vertical carousel, parallax, etc.), open an issue.


📜 License

MIT License — feel free to use this project for learning or production.

About

This is animation practices repo for React Native

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published