Sticky Parallax Header

Brought with ❤️ by

# Introduction

react-native-sticky-parallax-header is a simple React Native library, enabling to create a fully custom header layout for your iOS, Android and web apps.

Documentation | Preview | Installation | Contributing

## Documentation Read the full Docs at: https://netguru.github.io/sticky-parallax-header/ ## Preview Sticky Parallax Header ships with 3 different use cases for sticky headers and a possibility to create fully custom header! | Tabbed Header | Avatar Header | Details Header | | :----------------------------------------------------: | :----------------------------------------------------: | :------------------------------------------------------: | | ![Tabbed Header Gif](./assets/readme_TabbedHeader.gif) | ![Avatar Header Gif](./assets/readme_AvatarHeader.gif) | ![Details Header Gif](./assets/readme_DetailsHeader.gif) | ## In Use **Check the live demo on Expo Snack [here](https://snack.expo.dev/@netguru_rnd/sticky-parallax-header-example).** This is how you can display header in your app: ```tsx import * as React from 'react' import { DetailsHeaderScrollView } from 'react-native-sticky-parallax-header' import { SafeAreaProvider } from 'react-native-safe-area-context' const TestScreen = () => ( {/** scroll view content */} ) export default TestScreen ``` ## Installation ### Installation & requirements :information_source: Library supports react-native version 0.64+ #### Install latest library version ```sh $ yarn add react-native-sticky-parallax-header@rc ``` #### Install library's dependencies ```sh yarn add react-native-reanimated react-native-safe-area-context ``` After installation: - check Reanimated installation [guide](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation) - handle Pods installation with `npx pod-install` - wrap your root component with `SafeAreaProvider` from `react-native-safe-area-context`

Contributing

[Contributing guidelines](CONTRIBUTING.md) # License This library is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).