Installation
Add the dependency:
npm i react-native-toggle-button
Peer Dependencies
Zero Dependency
Usage
Import
import ToggleButton from "react-native-toggle-button";
Fundamental Usage
<ToggleButton
primaryText="On"
secondaryText="Off"
onPress={(isToggled: boolean) => {
console.log(isToggled);
}}
/>
😍
Example Project You can checkout the example project
Simply run
npm i
react-native run-ios/android
should work of the example project.
Configuration - Props
Fundamentals
Property | Type | Default | Description |
---|---|---|---|
primaryText | string | undefined | change the primaryText |
secondaryText | string | undefined | change the secondaryText |
onPress | function | undefined | set your own logic for the button functionality when it is pressed |
Customization (Optionals)
Property | Type | Default | Description |
---|---|---|---|
inial | boolean | true | let you change the initial toggled value |
style | ViewStyle | default | set or override the style object for the main container |
activeButtonStyle | ViewStyle | default | set or override the style object for the active button style |
inactiveButtonStyle | ViewStyle | default | set or override the style object for the inactive button style |
activeTextStyle | TextStyle | default | set or override the style object for the active text style |
inactiveTextStyle | TextStyle | default | set or override the style object for the inactive text style |
TouchableComponent | TouchableWithoutFeedback | default | set your own component instead of default react-native TouchableWithoutFeedback component |
Future Plans
- [x]
LICENSE - [ ] Write an article about the lib on Medium
Author
FreakyCoder, kurayogun@gmail.com
License
React Native Toggle Button is available under the MIT license. See the LICENSE file for more info.