diff --git a/src/app/components/CustomCheckBox.js b/src/app/components/CustomCheckBox.js new file mode 100644 index 0000000..2517eb1 --- /dev/null +++ b/src/app/components/CustomCheckBox.js @@ -0,0 +1,39 @@ +import React from 'react'; +import { Pressable, StyleSheet, View, } from 'react-native'; +import { MaterialCommunityIcons } from "@expo/vector-icons"; +import colors from "../config/colors"; + +export default function CustomCheckBox({value, onValueChange, ...otherProps}) { + const onCheckmarkPress = () => { + onValueChange(!value); + } + + return ( + + + {value && } + + + ); +} + + +const styles = StyleSheet.create({ + checkboxBase: { + width: 20, + height: 20, + justifyContent: 'center', + alignItems: 'center', + borderRadius: 4, + borderWidth: 2, + borderColor: colors.primary, + backgroundColor: 'transparent', + }, + checkboxChecked: { + backgroundColor: colors.primary, + }, + + +}); diff --git a/src/app/components/forms/CheckBox.js b/src/app/components/forms/CheckBox.js index 43f375e..c9d393c 100644 --- a/src/app/components/forms/CheckBox.js +++ b/src/app/components/forms/CheckBox.js @@ -1,12 +1,13 @@ import React, { useEffect, useState } from "react"; -import { CheckBox, View, Text } from "react-native"; +import { View, Text } from "react-native"; import { useFormikContext } from "formik"; import colors from "../../config/colors"; import { TouchableOpacity } from "react-native-gesture-handler"; import ErrorMessage from "./ErrorMessage"; import { dimensions } from "../../config/dimensions"; +import CustomCheckBox from "../CustomCheckBox"; -const Checkbox = ({ name, children, navigate, ...props }) => { +export default function CheckBox({ name, children, navigate, ...props }) { const { setFieldValue, errors, touched } = useFormikContext(); const [toggleCheckBox, setToggleCheckBox] = useState(false); @@ -22,16 +23,11 @@ const Checkbox = ({ name, children, navigate, ...props }) => { alignItems: "center", }} > - - setToggleCheckBox(newValue)} - type={"checkbox"} - tintColors={{ true: colors.primary }} - onCheckColor={colors.primary} - {...props} + style={{marginRight: 12}} /> - { @@ -50,6 +46,7 @@ const Checkbox = ({ name, children, navigate, ...props }) => { navigate()}> { ); }; - -export default Checkbox; diff --git a/src/app/screens/RegisterScreen.js b/src/app/screens/RegisterScreen.js index 22f8ce4..2abb29f 100644 --- a/src/app/screens/RegisterScreen.js +++ b/src/app/screens/RegisterScreen.js @@ -37,6 +37,7 @@ import authStorage from "../auth/storage"; import ConfirmationModal from "../components/ConfirmationModal"; import PasswordFormField from "../components/forms/PasswordFormField"; import constants from "../config/constants"; +import CheckBox from "../components/forms/CheckBox"; const phoneRegex = RegExp( /^\(?[\(]?([0-9]{2,3})?\)?[)\b]?([0-9]{4,5})[-. ]?([0-9]{4})$/ @@ -539,23 +540,28 @@ export default function RegisterScreen(props) { paddingLeft={2} /> - {/*Termos de uso* + + + Termos de uso* - props.navigation.navigate("UserAgreement")} /> - */} + + + + { props.navigation.goBack();