This is a simple React Native number counter component.
Add react-native-number-view to your project by executing
$ npm install react-native-number-view
or
$ yarn add react-native-number-view
and that's it, you're all good to go!
/**
* Sample React Native App
* https://github.com/facebook/react-native
*
* @format
* @flow
*/
import React, {Component} from 'react';
import {View} from 'react-native';
import {NumberView} from 'react-native-number-view'
type Props = {};
export default class App extends Component<Props> {
render() {
return (
<View style={styles.container}>
<NumberView
enableDefaultStyles={true}
themeColor="#3F6D2A"
leftContent={<Text>๐</Text>}
rightContent={<Text>๐</Text>}
onValueChange={(newVal)=>{alert(newVal)}}
onDecrement={()=>{alert('decremented')}}
onIncrement={()=>{alert('Incremented')}}
/>
</View>
);
}
}
Name | Use | Default Values |
---|---|---|
leftContent | Content to be displayed on the left | None |
rightContent | Content to be displayed on the Right | None |
onValueChange | Callback which return new value | None |
onDecrement | callback each time value is decremented | None |
onIncrement | callback each time value is incremented | None |
themeColor | Use to set a theme color(only accepts HEX) | none |
enableDefaultStyles (boolean) | enable or disable preset styles | True |
initialValue | counters initial value | 0 |
What to help make this package even more awesome? Read how to contribute
This project is licensed under MIT license.
Thanks goes to these wonderful people (emoji key):
Oluwatobi Shokunbi ๐ป ๐ |
This project follows the all-contributors specification. Contributions of any kind welcome!