React Native Interactable
Experimental implementation of high performance interactable views in React Native
Overview:
The react-native-interactable library is designed to support complex physical interactions with ease using a physics engine to drive interactions on the native side. It enables fluid user interactions by continuously reacting to the user's gestures, aiming to run at 60 frames per second to provide a natural touch device experience.
Features:
- Swipeable card: Allows a card to spring into place unless swiped away with enough force.
- Drawer snapping: Enables a drawer to snap between closed and open states with buttons appearing gradually as it is dragged.
- Collapsible header: Allows a header to snap to a smaller size as the content below is scrolled.
- Chat heads: Similar to Facebook Messenger, these heads can be dragged around and snap to corners of the screen.
Summary:
The react-native-interactable library provides a solution for implementing complex physical interactions in React Native, supporting high-performance gestures with properties like springiness, friction, elasticity, and damping. By utilizing a physics engine on the native side, it aims to run at 60 FPS for seamless user experiences.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- React Native
React Native is a framework for building mobile applications using React and JavaScript. It enables developers to write once and deploy to multiple platforms, including iOS, Android, and the web, while providing a native app-like experience to users.
- Eslint
ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.