React Native Header Bar

Header bar with a hamburger menu for react-native apps.

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

What things you need to install the software:

Download and Install: Node

Once Node is installed, run

npm install react-native

Have an up and running react-native project. See https://facebook.github.io/react-native/docs/getting-started for more information.

Installing

To install component, navigate to project root directory and run

npm install react-native-simple-headerbar

Documentation

Props

Name	Type	Required	Default
`hideHamburgerMenu`	`PropTypes.boolean`	No	\| Boolean to hide hamburger menu.
`onMenuPress`	`PropTypes.func`	No	\| Function to handle on hambruger menu press.
`hamburgerMenuColor`	`PropTypes.string`	No	\| String to hold hamburger menu color.
`text`	`PropTypes.string`	No	\| Title for the header.
`textStyle`	`PropTypes.object`	No	\| CSS object to style text.
`showBackButton`	`PropTypes.boolean`	No	\| Boolean to control if back button should be shown. (hideHamburgerMenu takes precedence)
`onBackButtonPress`	`PropTypes.func`	No	\| Function to handle on back button press.
`style`	`PropTypes.object`	No	\| CSS object to style bar.

Usage

Within react-native js file

import Header from 'react-native-headerbar';

<Header
    hideHamburgerMenu={false}
    hamburgerMenuColor="white"
    onMenuPress={...}
    text="Example"
    textStyle={...}
/>

Built With

Versioning

We use SemVer for versioning. For the versions available, see the tags on this repository.

Authors

Hamza Varvani - Initial work - HamzaKV

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Acknowledgments

Inspiration - https://github.com/fattahmuhyiddeen/react-native-arrow

Package detail

@hamzav/react-native-headerbar

readme