How to implement radio button in React Native

Question

I am converting React code to React Native. So I need to implement radio buttons.

Answer 1

You can mimic a radio button really easily using just barebones RN. Here's one simple implementation which I use. Tweak size, colors etc. as you like. It looks like this (with a different tint, and some text). Add TouchableOpacity on top to turn it into a button that does something.

function RadioButton(props) {   return (       <View style={[{         height: 24,         width: 24,         borderRadius: 12,         borderWidth: 2,         borderColor: '#000',         alignItems: 'center',         justifyContent: 'center',       }, props.style]}>         {           props.selected ?             <View style={{               height: 12,               width: 12,               borderRadius: 6,               backgroundColor: '#000',             }}/>             : null         }       </View>   ); }