Skip to content

WrathChaos/react-native-apple-header

Repository files navigation

React Native Apple Header

Battle Tested ✅

React Native Apple Header

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

React Native Apple Header

Version 1 🥳 🚀

  • Better typing support
  • Better customization
  • Code cleaning
  • Breaking CHANGES!

Installation

Add the dependency:

npm i react-native-apple-header

Peer Dependencies

Zero Dependencies

Usage

Import

import AppleHeader from "react-native-apple-header";

Fundamental Usage

<AppleHeader
  dateTitle={"Monday, 27 November"}
  largeTitle={"For You"}
  imageSource={{
    uri: profileImageSource,
  }}
  onPress={() => {}}
/>

Configuration - Props

AppleHeader Props

Property Type Default Description
dateTitle string undefined set your own string instead of date title
largeTitle string undefined set your own large title
imageSource image undefined set your own image
onPress function undefined use this to set onPress functionality
style ViewStyle default style use this to set your own style for whole container
dateTitleTextStyle TextStyle default style use this to set your own style for date title
largeTitleStyle TextStyle default style use this to set your own style for large title
avatarStyle ViewStyle default style use this to set your own style for avatar style (DO NOT FORGET TO ADD BORDER-RADIUS!)

Future Plans

  • LICENSE
  • Write an article about the lib on Medium

Credits

Thank you so much for the image Unsplash

Author

FreakyCoder, kurayogun@gmail.com

License

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