react-native-custom-headers

1.0.1 • Public • Published

<<<<<<< HEAD

react-native-custom-headers

Custom headers for react-native using react-navigation for managing navigations in react-native apps.

REACT-NATIVE-CUSTOM-HEADERS!

Twitter

react-native custom headers for creating custom headers for the app using the react-navigation package for managing navigations in their app.

Installation

npm install react-native-custom-headers --save

PROPS

Prop Type Default Description
navigation ---- navigation REQUIRED Pass the navigation prop
headerName String Empty Enable Header Title
showHeaderImage Boolean ------- Enable Header Image
headerImagePath path ------- Required (if showHeaderImage is taken true)
headerColor String ------- Header Bar Color
headerTextStyle Stylesheet ------- Custom stylesheet to Header Title

Screenshots

![Alt text]
![Alt text]

HOW TO USE?

Import it using:

import Header from 'react-native-custom-headers;

and then,

<Header navigation={this.props.navigation}
showHeaderImage={false}
backImagePath ={require('./resources/back.png')}
headerImagePath = {require('./resources/logo.png')}
headerName={'SUB CATEGORY'}/>

`

You can also use this component with react-navigation custom header call like this,

navigationOptions: {
  header: props => <Header {...props} />,
},

OR,

Reclaim: {
    screen: GiftReclaimSection,
    navigationOptions: {
      tabBarLabel: 'Reclaim',
      header: <Header/>,
    }
  }

OR like this also,

static navigationOptions = {
    header: <Header/>,
  };
 

second commit

Package Sidebar

Install

npm i react-native-custom-headers

Weekly Downloads

1

Version

1.0.1

License

SEE LICENSE IN LICENSE

Unpacked Size

109 kB

Total Files

6

Last publish

Collaborators

  • harshitmadhav