Skip to content
Simple and Best. An easy to use radio buttons for react native apps.
Branch: master
Clone or download
ThakurBallary Merge pull request #13 from rafaelcalhau/label-styles
More style capabilities for the labels.
Latest commit ccba6fb Dec 14, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
lib Allowing to start the radio group with all options unselected. Jun 15, 2019
LICENSE Initial commit Apr 5, 2018 Added reference to react-native-btr Aug 5, 2018
index.js Restructured folders Apr 7, 2018
package.json Demo UPDATED Apr 15, 2018

React Native Radio Buttons Group

Simple and Best. An easy to use radio buttons for react native apps.



Getting Started

NOTE: This package is updated and actively maintained in react-native-btr library. Hence, we recommend you to use this component from react-native-btr library.

Just a sneak peek (lots more can be done)



npm i react-native-radio-buttons-group --save


import React, { Component } from 'react';
import { Text, View, StyleSheet } from 'react-native';

import RadioGroup from 'react-native-radio-buttons-group';

export default class App 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 = => e.selected == true);
        selectedButton = selectedButton ? selectedButton.value :[0].label;
        return (
            <View style={styles.container}>
                <Text style={styles.valueText}>
                    Value = {selectedButton}
                <RadioGroup radioButtons={} onPress={this.onPress} />

const styles = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
    valueText: {
        fontSize: 18, 
        marginBottom: 50,


Key Type Default Value
color String #444 all css color formats
disabled Boolean false true / false
label String You forgot to give label any string
layout String column row / column
selected Boolean false true / false
size Number 24 positive numbers
value String value assigned to label any string
Horizontal (side by side)


Contribution always motivates.

Incase of suggestions, Google my name "Thakur Ballary" and reach me on any social platforms.

Please read for details on our code of conduct, and the process for submitting pull requests to us.


This project is licensed under the MIT License

You can’t perform that action at this time.