diff options
| author | Maksymilian Jopek <maks@jopek.eu> | 2022-03-03 22:57:17 +0100 |
|---|---|---|
| committer | Maksymilian Jopek <maks@jopek.eu> | 2022-03-03 22:57:17 +0100 |
| commit | 5cf454c6800d6bfe26e08c6b4393b82bff442b4d (patch) | |
| tree | 55ad9e2bfdfa35e2665451ed9f3b370e7d6d6a70 /components/RadioButton.js | |
| download | aparatus-5cf454c6800d6bfe26e08c6b4393b82bff442b4d.tar.gz aparatus-5cf454c6800d6bfe26e08c6b4393b82bff442b4d.tar.zst aparatus-5cf454c6800d6bfe26e08c6b4393b82bff442b4d.zip | |
Initial commit - v1.0.0
Diffstat (limited to 'components/RadioButton.js')
| -rw-r--r-- | components/RadioButton.js | 56 |
1 files changed, 56 insertions, 0 deletions
diff --git a/components/RadioButton.js b/components/RadioButton.js new file mode 100644 index 0000000..4c178e2 --- /dev/null +++ b/components/RadioButton.js @@ -0,0 +1,56 @@ +import * as React from 'react'; +import { StyleSheet, View, TouchableOpacity, Text } from "react-native"; + +export default class RadioButton extends React.Component { + constructor(props) { + super(props); + this.state = { + value: props.value ?? true, + contStyle: props.style ?? {}, + onClick: props.onClick, + label: props.label, + } + } + + render() { + return ( + <View style={[this.state.contStyle, styles.contStyle]}> + <TouchableOpacity style={styles.outer} onPress={this.state.onClick}> + <View style={this.state.value ? styles.inner : {}}></View> + </TouchableOpacity> + <Text style={styles.label}>{this.state.label}</Text> + </View > + ) + } +} + +const styles = StyleSheet.create({ + contStyle: { + flexDirection: "row", + marginTop: 10, + }, + label: { + marginLeft: 15, + marginTop: 3, + fontSize: 17, + fontWeight: "bold", + color: "white", + }, + outer: { + borderColor: "#EB1F63", + borderWidth: 2, + borderRadius: 20, + width: 30, + height: 30, + }, + inner: { + borderColor: "#EB1F63", + borderWidth: 10, + borderRadius: 20, + width: 20, + height: 20, + top: 3, + left: 3, + }, +}) + |
