Implementation of Facebook Paper-like interactive UI in React Native.
JavaScript
Latest commit 2336995 Dec 6, 2016 @paramaggarwal committed on GitHub Merge pull request #6 from Thorbenandresen/patch-1
Remove translateX interpolation and center the list view. This fixes the black border on the right side while expanding the card as seen in the Vimeo video at 0:22min

README.md

rn-paper-interface

Implementation of Facebook Paper-like interactive UI in React Native.

Read the blog post: Building a Facebook Paper-like UI with React Native on Medium.

This is a technical demo and not a library. Feel free to learn from the code and adapt to your use-case.

Demo

Run with Exponent: https://getexponent.com/@community/paper-interface-example

See it on Vimeo: https://vimeo.com/175727390

GIF

project demo

Try it out

  1. Clone the repo
  2. Run npm install and rnpm link.
  3. Open ios/RNPaperInterface.xcodeproj and run the project.
  4. This should compile the project and run the sample in the simulator.

Author

Param Aggarwal (paramaggarwal@gmail.com)

License

MIT License