A React Native wrapper for Android's CollapsingToolbarLayout with built-in support for Animated.Event and FlatList.
react-native-collapsing-toolbar is a React Native library that provides a wrapper for Android's native CollapsingToolbarLayout, enabling developers to implement collapsible toolbar animations in React Native Android applications. It integrates with React Native's animation system and scrollable components to deliver a native-like Material Design experience. The library solves the problem of bringing complex Android-specific UI patterns, like collapsing toolbars with parallax effects, to React Native with minimal abstraction.
React Native developers building Android applications who need to implement Material Design patterns, specifically collapsible toolbars with coordinated scrolling behaviors. It is suited for those requiring deep integration with native Android UI components like CoordinatorLayout and NestedScrollView.
Developers choose this library because it provides direct access to Android's native CollapsingToolbarLayout APIs, ensuring high performance and authentic Material Design behavior. Its seamless integration with Animated.Event and FlatList, along with support for custom animations and parallax effects, offers a more native and flexible solution compared to JavaScript-only alternatives.
react-native wrapper for android CollapsingToolbarLayout
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Directly wraps Android's CollapsingToolbarLayout, ensuring authentic Material Design animations and smooth scrolling, as emphasized in the project's philosophy of minimal abstraction.
Supports Animated.Event via onOffsetChanged events, allowing custom animations during collapse/expand without nested scroll conflicts, demonstrated in the usage examples.
Works with FlatList by using renderScrollComponent to wrap content in NestedScrollView, enabling efficient list rendering within the collapsing layout, as detailed in the README.
Includes CollapsingParallax component with parallaxMultiplier prop for easy implementation of parallax scrolling effects in headers, showcased in the example GIF.
Only supports Android, making it useless for iOS development and requiring separate solutions for cross-platform apps, a significant limitation not addressed in the library.
The README explicitly warns that the component is 'very easy to break' and requires strict adherence to component order, increasing debugging time and risk of layout issues.
Installation demands manual edits to MainApplication.java, build.gradle, and settings.gradle, which is error-prone and complicates project maintenance compared to pure JavaScript libraries.
Does not support RefreshControl when used with FlatList, as noted in the README, limiting functionality for apps that need pull-to-refresh features in scrolling lists.