Skip to content

a react-native ui component to clone the instagram's feed post list item component, step by step with animations

Notifications You must be signed in to change notification settings

gupta-ji6/react-native-instagram-post-ui

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-native-instagram-post-ui

An attempt to recreate the instagram feed post item UI in react-native with react-native-reanimated animations.

Supports Expo iOS Supports Expo Android

Features

1. ❤️ Double Tap to Like

Simulator.Screen.Recording.-.iPhone.15.-.2024-01-10.at.11.57.35.mp4
  • handle both single & double tap
  • scale with spring
  • rotate while scaling (currently it rotates after scaling)
  • rotation angle should be random
  • translate to top after scale & rotate

2. 🏷️ Show Tags on Single Tap

Simulator.Screen.Recording.-.iPhone.15.-.2024-01-10.at.17.34.25.mp4
  • show user icon at bottom left on single tap
  • show multiple user tags on single tap
  • animate tags & icon opacity
  • add arrow in tags component

Contributing

Note

The project was created with command npx create-expo-app@latest react-native-instagram-post-ui -e with-reanimated

  • Run yarn or npm install
  • Run yarn start or npm run start to try it out.

📝 Notes

About

a react-native ui component to clone the instagram's feed post list item component, step by step with animations

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published