react-native 单选按钮

安装:

npm i -S react-native-flexi-radio-button

使用:

import {RadioGroup,RadioButton} from "react-native-flexi-radio-button";

<View}
    <Text>我的性别是</Text>
    <RadioGroup
        style={styles.radio}
        size={18}
        color={"blue"}
    >
        <RadioButton>
            <Text style={styles.boyText}>男士</Text>
        </RadioButton>
        <RadioButton>
            <Text style={styles.girlText}>男士</Text>
        </RadioButton>
    </RadioGroup>
</View>

radio:{
  flexDirection:"row",
  alignItems:"center"
},
boyText:{
  color:"#2b89ca"
},
girlText:{
 color:"#d96a5f" 
}

效果图:

1.png


RadioGroup 属性:

style: 自定义样式。

size: 设置按钮的大小。

thickness: 设置按钮边框的宽度。

color: 设置按钮的颜色。

activeColor: 设置选中时按钮的颜色。

highlightColor: 设置选中后按钮的背景。

onSelect: 函数在按钮被选中时被调用。

RadioButton 属性:

style: 自定义样式。

disabled: 为true时禁用组件的所有交互。

日记本

如果觉得我的文章对您有用,请随意赞赏。您的支持将鼓励我继续创作!

赞赏支持
被以下专题收入,发现更多相似内容