A highly customizable drawer component for React Native apps, supporting material design, slack style, and parallax effects.
React Native Drawer is a configurable drawer/side menu component for React Native applications. It enables developers to implement various navigation drawer styles, including material design, slack style, and parallax effects, across both iOS and Android platforms. However, the project maintainers caution that it may not be performant enough for production use compared to alternatives.
React Native developers who need a highly customizable drawer component for prototyping, experimentation, or non-production applications where performance is not critical.
Developers choose React Native Drawer for its extensive customization options, including multiple drawer types, flexible animation control via tween handlers, and configurable gestures, which allow for unique visual effects not easily achievable with more performant alternatives.
React Native Drawer
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Offers over 20 props to control drawer types (displace, overlay, static), offsets, gestures, and animations, enabling unique styles like material design and parallax effects as shown in the examples.
Uses a tween handler for custom animations, allowing transformations such as skew and fade via transformMatrix, which isn't easily achievable with simpler drawer components.
Supports drawer placement on all four screen edges (left, right, top, bottom), providing flexibility not found in many alternatives limited to left or right.
Allows drawer manipulation via props for controlled components, refs for imperative calls like .open(), or React context for decoupled access, as detailed in the usage section.
The README prominently warns against production use due to inefficient animations, recommending alternatives like React Navigation or React Native Side Menu for better performance.
Relies on a custom tween handler instead of React Native's Animated API, with a note that future updates will require breaking changes, risking long-term compatibility.
With numerous props for gestures, animations, and offsets, setting up even a basic drawer can be complex and error-prone, especially for developers needing simple functionality.
Compared to mainstream options like React Navigation, it lacks community plugins, frequent updates, and seamless integration, making troubleshooting and enhancements harder.