1.0.0 • Published 2 years ago

react-native-gorgeous-header v1.0.0

Weekly downloads
19
License
MIT
Repository
github
Last release
2 years ago

Battle Tested ✅

React Native Gorgeous Header

npm version npm Platform - Android and iOS License: MIT styled with prettier

Installation

Add the dependency:

npm i react-native-gorgeous-header

Peer Dependencies

Zero Dependency

Usage

Import

import GorgeousHeader from "react-native-gorgeous-header";

Fundamental Usage

<GorgeousHeader
  menuImageSource={menuImage}
  searchImageSource={searchImage}
  profileImageSource={{
    uri:
      "https://images.unsplash.com/photo-1514846226882-28b324ef7f28?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=934&q=80",
  }}
/>

Configuration - Props

Gorgeous Header Props

PropertyTypeDefaultDescription
titlestringOrderchange the title
subtitlestringHealthy food can keep you fit.change the subtitle
searchIconassetdefaultset your own icon for the search one
stylestyledefaultset your own style for main container
contentContainerStylestyledefaultset your own style for content container style
titleTextStylestyledefaultset your own style for title text
subtitleTextStylestyledefaultset your own style for subtitle text
searchBarStylestyledefaultset your own style for search text input container
searchInputStylestyledefaultset your own style for search text input
menuImageStylestyledefaultset your own style for hamburger menu image
menuImageSourceassetdefaultset your own image instead of default hamburger menu image
profileImageStylestyledefaultset your own style for profile image
profileImageSourceassetundefineduse this to set your own image for profile image
onMenuImagePressfunctionundefineduse this to set your own function for pressing the hamburger menu image
onProfileImagePressfunctionundefineduse this to set your own function for pressing the profile image

Future Plans

  • LICENSE

Author

FreakyCoder, kurayogun@gmail.com

License

React Native Gorgeous Header is available under the MIT license. See the LICENSE file for more info.