Skip to content

Instantly share code, notes, and snippets.

@ThakurBallary
Last active May 30, 2018 10:06
Show Gist options
  • Save ThakurBallary/bf6e9fa4abc4b4bb0283431ee1bb3904 to your computer and use it in GitHub Desktop.
Save ThakurBallary/bf6e9fa4abc4b4bb0283431ee1bb3904 to your computer and use it in GitHub Desktop.
React Native Radio Buttons Group
import React, { Component } from 'react';
import { Text, View, StyleSheet } from 'react-native';
import RadioGroup from 'react-native-radio-buttons-group';
export default class Vertical extends Component {
state = {
data: [
{
label: 'Default value is same as label',
},
{
label: 'Value is different',
value: "I'm not same as label",
},
{
label: 'Color',
color: 'green',
},
{
disabled: true,
label: 'Disabled',
},
{
label: 'Size',
size: 32,
},
],
};
// update state
onPress = data => this.setState({ data });
render() {
let selectedButton = this.state.data.find(e => e.selected == true);
selectedButton = selectedButton ? selectedButton.value : this.state.data[0].label;
return (
<View style={styles.container}>
<Text style={{ fontSize: 18, marginBottom: 50 }}>
Value = {selectedButton}
</Text>
<RadioGroup radioButtons={this.state.data} onPress={this.onPress} />
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment