1.1.0 โ€ข Published 4 years ago

rn-curved-navigation-bar v1.1.0

Weekly downloads
5
License
ISC
Repository
-
Last release
4 years ago

ReactNative Curved Navigation Bar

Animated Curved Navigation Bar for React Native

Getting Started

1 | You need to install React native Vector Icons npm i react-native-vector-icons Goto https://github.com/oblador/react-native-vector-icons to solve linking problems(if occurs).

2 | Install Rn curved navigation bar npm i rn-curved-navigation-bar

or

yarn add rn-curved-navigation-bar

Props

PropTypedefaultdescription
iconsarray-5 icons name in array
selectednumber1initial tab icon selected
iconColorstringblacknav bar icons color
selectedIconColorstringwhiteselected icon color
mainOffSetIosnumber-bottom offset of nav bar in ios
mainOffSetAndroidnumber-bottom offset of nav bar in android
navColorstring#4687FDMain navigation bar color
cbfunction-returns page selected id that can be mapped

Example of using cb to change the state

import CurvedNavBar from 'rn-curved-navigation-bar'


<CurvedNavBar icons={['air-horn','alarm','android-auto','auto-fix','bell-ring']} 
navColor={'#482ff7'}
cb={(id)=>{this.setState({page:id})}} //change the parent's state of page 
/>

Todo features

๐Ÿ‘‰๐ŸผTo implement change tab from foreign component ๐Ÿ‘‰๐ŸผTo fix for less than 5 icons ๐Ÿ‘‰๐Ÿผmore styles and customize option

1.1.0

4 years ago

1.0.8

4 years ago

1.0.7

4 years ago

1.0.6

4 years ago

1.0.5

4 years ago

1.0.4

4 years ago

1.0.3

4 years ago

1.0.2

4 years ago

1.0.1

4 years ago

1.0.0

4 years ago