react-native-progress-arrow

React native progress arrow is a progress step indicator with an arrow style.

Support

iOS & Android

Installation

npm install react-native-progress-arrow

Installing dependencies

npm install react-native-svg

• react-native-svg

Usage

import ProgressArrow from 'react-native-progress-arrow';

// ...
<ProgressArrow
    steps={5}
    step={2}
    color={'blue'}
    customLabelStyle={{color: 'red', fontWeight: 'bold', fontSize: 20}}
    customProgressStyle={{height: 60}}
/>

Properties

Basic

| Prop | Default | Type | Description | | :----------------- | :-----------: | :--------: | :------------------------------------------------------------------------------- | | steps | 0 | number | The number of progres step | | step | 0 | number | The current step | | color | 'blue' | string | The background color of the progress step |

Custom styles

| Prop | Default | Type | Description | | :---------------------- | :-----------: | :--------: | :------------------------------------------------------------------------- | | customContainerStyle | {...} | style | Style of the main constainer | | customProgressStyle | {...} | style | Style of the progress bar | | customLabelStyle | {...} | style | Style of the progress label |

Made with create-react-native-library