1.2.0 • Published 4 years ago

react-native-breadcrumb v1.2.0

Weekly downloads
25
License
ISC
Repository
github
Last release
4 years ago

react-native-breadcrumb npm version

A react-native breadcrumb for both android and ios. You can define any number of crumbs and this will automatically adjust according to the wrapped view's width. If you need you can change the selected crumb by tapping on a crumb(should be activated by passing 'true' to isTouchable prop).

Demo

Alt text

Installation

yarn add react-native-breadcrumb

or

npm install --save react-native-breadcrumb

Usage

import Breadcrumb from 'react-native-breadcrumb';

 <Breadcrumb
          entities={['My Tab 1', 'My Tab 2', 'My Tab 3']}
          isTouchable={true}
          flowDepth={0}
          height={30}
          onCrumbPress={index => {}}
          borderRadius={5}
 />

Prop-types

Prop nameType
entitieslist - list of names for crumbs
flowDepthint - indicates selected crumb indexing from 0
isTouchableboolean - identify if crumbs are touchable
onCrumbPressfunction - this returns the selected crumbs index and is required if isTouchable is 'true'
borderRadiusint - radius of the container
crumbsContainerStyleobject - styles for view
crumbStyleobject - styles for view
activeCrumbStyleobject - styles for view
crumbTextStyleobject - styles for Text
activeCrumbTextStyleobject - styles for view
heightint - indicates the height in pixels

Example

checkout sample directory and findout a react-native app.

react-native run-android

or

react-native run-ios