- Each screen has its own representative icon that is shown on the application’s header – the icon of the screen shown in the viewport is always centered, and depending on which screen you’re in, the icons of the remaining screens are shown on the left/right edges of the header.
- Clicking on any of the left/right icons will cause a screen transition, also allowing for the icons themselves to animate while the transition is in progress.
- The library takes care of the screen and header transitions, and leaves it up to the user to define animations that occur on the icons during the transitions.
- At the moment in which this was developed, react-navigation did not provide screen transitions from left to right, and the header transitions were difficult to customise.
- We have thereafter integrated this project into others that are using react-navigation with excellen results, given that this navigator behaves as any other screen in the app.
A tinder style navigator that allows you to navigate between three adjacent screens with smooth header transitions.
Continue reading “react-native-tinder-navigator”