A React Native button component that animates between different visual states like idle, busy, and success.
React Native Awesome Button is a React Native component that creates buttons with multiple visual states and animated transitions between them. It solves the problem of building interactive buttons that need to reflect different states, such as loading, success, or error, with smooth animations and customizable styles.
React Native developers building mobile applications who need interactive, stateful buttons with animated feedback for user actions like login, submission, or multi-step processes.
Developers choose this library for its simplicity in implementing complex button behaviors, its smooth animations, and the flexibility to define unlimited states with custom styles and event handlers, reducing the need to write custom animation code.
A button React Native component supporting showing different states with animations
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Provides smooth animated transitions between unlimited button states, as shown in the advanced example with idle, busy, and success states using the buttonState prop.
Allows full control over background and label styles for each state using React Native's StyleSheet, with properties matching View and Text components per the component properties table.
Supports adding any View as an icon and includes built-in spinner options for loading states, with icon alignment controls (left or right) demonstrated in the advanced example.
Enables assigning different onPress functions for each state, allowing context-specific actions like handling login attempts, as seen in the idle state's onPress binding.
The README lacks detailed API references, advanced usage guides, and the roadmap admits the need for tests, which may hinder troubleshooting and adoption.
Examples are configured for iOS (e.g., Xcode setup), and Android support is not thoroughly demonstrated, posing challenges for cross-platform development.
Defining states requires a nested object structure that can be cumbersome for simple buttons, compared to React Native's built-in components with minimal props.
Version 1.7.0 introduced major refactoring with breaking changes, indicating potential instability in future updates that could break existing implementations.