diff --git a/src/app/assets/floodZonesAssets/not_passable.svg b/src/app/assets/floodZonesAssets/not_passable.svg
new file mode 100644
index 0000000..de5fbb0
--- /dev/null
+++ b/src/app/assets/floodZonesAssets/not_passable.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/app/assets/floodZonesAssets/passable.svg b/src/app/assets/floodZonesAssets/passable.svg
new file mode 100644
index 0000000..e335bb6
--- /dev/null
+++ b/src/app/assets/floodZonesAssets/passable.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/app/components/SvgLabeledButton.js b/src/app/components/SvgLabeledButton.js
index 8de9175..d852739 100644
--- a/src/app/components/SvgLabeledButton.js
+++ b/src/app/components/SvgLabeledButton.js
@@ -1,8 +1,8 @@
-import React, { useEffect, useState } from "react";
-import { StyleSheet, View, Text, TouchableOpacity, TouchableHighlight } from "react-native";
+import React from "react";
+import { StyleSheet, View, Text, TouchableHighlight, TouchableNativeFeedback } from "react-native";
import colors from "../config/colors";
import { scaleDimsFromWidth } from "../config/dimensions";
-import {Shadow} from "react-native-shadow-2";
+import { Shadow } from "react-native-shadow-2";
export default function SvgLabeledButton({
SvgImage,
@@ -16,34 +16,32 @@ export default function SvgLabeledButton({
toggledBgColor = colors.toggle,
}) {
const dims = scaleDimsFromWidth(width, height, 16);
- return (
-
+ return (
-
-
-
-
-
+ viewStyle={[{ width: 130, height: 130 }, style]}
+ offset={[0, 4]}
+ distance={4}
+ radius={4}
+ startColor="rgba(0, 0, 0, 0.25)"
+ paintInside={true}
+ >
+
+
+
+
- {label}
+ {label}
+
-
-
+
);
}
@@ -55,8 +53,8 @@ const styles = StyleSheet.create({
backgroundColor: colors.primary,
borderWidth: 6,
borderRadius: 6,
- width: 125,
- height: 125,
+ width: 130,
+ height: 130,
},
innerContainer: {
overflow: "hidden",
@@ -65,7 +63,6 @@ const styles = StyleSheet.create({
borderRadius: 6,
alignItems: "center",
justifyContent: "center",
-
},
label: {
paddingTop: 5,
diff --git a/src/app/config/assets.js b/src/app/config/assets.js
index 3292cf1..302e452 100644
--- a/src/app/config/assets.js
+++ b/src/app/config/assets.js
@@ -43,16 +43,14 @@ import PinRioExtravasado from "../assets/river/PinRioExtravasado";
import PinRioCheio from "../assets/river/PinRioCheio";
import PinPluviometroArt from "../assets/pluviometer/PinPluviometroArt";
+import FloodPassable from "../assets/floodZonesAssets/passable.svg";
+import FloodNotPassable from "../assets/floodZonesAssets/not_passable.svg";
+
export default {
floodZones: {
FloodZonesIcon: FloodZones,
- passable: require("../assets/floodZonesAssets/passable_icon.png"),
- passable_toggle: require("../assets/floodZonesAssets/Transitavel_c.png"),
-
- passable_2: require("../assets/floodZonesAssets/passable_2.png"),
- notPassable: require("../assets/floodZonesAssets/not_passable_icon.png"),
- notPassable2: require("../assets/floodZonesAssets/notpassable_2_toggle.png"),
- notPassable_toggle: require("../assets/floodZonesAssets/Intransitavel_c.png"),
+ passable: FloodPassable,
+ notPassable: FloodNotPassable,
},
riverLevel: {
diff --git a/src/app/screens/SharingFloodZonesScreen.js b/src/app/screens/SharingFloodZonesScreen.js
index c39f0d6..baf97ee 100644
--- a/src/app/screens/SharingFloodZonesScreen.js
+++ b/src/app/screens/SharingFloodZonesScreen.js
@@ -7,25 +7,16 @@ import FormImagePicker from "../components/forms/FormImagePicker";
import useLocation from "../hooks/useLocation";
import colors from "../config/colors";
import { scaleDimsFromWidth, dimensions } from "../config/dimensions";
-import {
- TouchableNativeFeedback,
- TouchableOpacity,
-} from "react-native-gesture-handler";
+import { TouchableNativeFeedback } from "react-native-gesture-handler";
import { insertFloodZone } from "../database/databaseLoader";
import { showMessage } from "react-native-flash-message";
import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
import Screen from "../components/Screen";
import assets from "../config/assets";
import moment from "moment";
-import FormDatePicker from "../components/forms/FormDatePicker";
-import FormLocationPicker from "../components/forms/FormLocationPicker";
import { EventLocationContext } from "../context/EventLocationContext";
import PickEventDateLocation from "../components/PickEventDateLocation";
-
-/*function submitForm(props) {
- console.log(props);
- insertFloodZone(props);
-}*/
+import SvgLabeledButton from "../components/SvgLabeledButton";
const validationSchema = Yup.object().shape({
images: Yup.array(),
@@ -81,35 +72,20 @@ function SharingFloodZonesScreen(props) {
validationSchema={validationSchema}
>
- setPassable(1)}>
-
- {passable == 1 ? (
-
- ) : (
-
- )}
-
-
-
- setPassable(0)}>
- {passable == 0 ? (
-
- ) : (
-
- )}
-
+ setPassable(1)}
+ />
+
+ setPassable(0)}
+ label={"INTRANSITÁVEL"}
+ isToggle={passable == 0}
+ SvgImage={assets.floodZones.notPassable}
+ />
{error && passable == -1 && (