Package Exports
- react-native-simple-stepper
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-simple-stepper) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
react-native-simple-stepper
A super simple react-native implementation of the classic UIStepper from iOS. Check out the props below for customization.
Installation
npm i react-native-simple-stepper --save
Usage
import SimpleStepper from 'react-native-simple-stepper'
//...
render() {
return (
<SimpleStepper valueChanged={(value) => this.valueChanged(value)} />
)
}
valueChanged(value) {
// ...
}
//...Demo
Props
| Name | Type | Description | Default
| ------------ | ------------- | ------------ |------------ |------------ |
| initialValue | Number | initial value | 0
| minimumValue | Number | minimum value | 0
| maximumValue | Number | maximum value | 10
| stepValue | Number | step value (i.e. increment by 10) | 1
| backgroundColor | String | background color | transparent
| tintColor | String | color for border, divider and images | blue
| padding | Number | stepper padding | 4
| valueChanged | Function | Fires when the value changes and the value will be passed down for processing like display or calculations | null
| incrementImage | String or Number | network or local image | require('./assets/increment.png')
| decrementImage | String or Number | network or local image | require('./assets/decrement.png')
| tintOnIncrementImage | Boolean | whether or not you want tintColor applied to increment image | true
| tintOnDecrementImage | Boolean | whether or not you want tintColor applied to decrement image | true
| imageHeight | Number | network image height | 36
| imageWidth | Number | network image width | 36
| activeOpacity | Number | touch opacity | 0.4
| disabledOpacity | Number | when step button is disabled | 0.5