Browse Source

Flood zones icons updated

master
GabrielTrettel 4 years ago
parent
commit
61daf53247
  1. BIN
      src/app/assets/floodZonesAssets/Intransitavel_c.png
  2. BIN
      src/app/assets/floodZonesAssets/Transitavel_c.png
  3. BIN
      src/app/assets/floodZonesAssets/notpassable_2_toggle.png
  4. BIN
      src/app/assets/floodZonesAssets/passable_2.png
  5. 9
      src/app/config/assets.js
  6. 40
      src/app/screens/SharingFloodZonesScreen.js

BIN
src/app/assets/floodZonesAssets/Intransitavel_c.png

After

Width: 93  |  Height: 106  |  Size: 3.1 KiB

BIN
src/app/assets/floodZonesAssets/Transitavel_c.png

After

Width: 93  |  Height: 106  |  Size: 2.7 KiB

BIN
src/app/assets/floodZonesAssets/notpassable_2_toggle.png

After

Width: 263  |  Height: 299  |  Size: 10 KiB

BIN
src/app/assets/floodZonesAssets/passable_2.png

After

Width: 93  |  Height: 106  |  Size: 2.7 KiB

9
src/app/config/assets.js

@ -11,12 +11,21 @@ import RainLow from "../assets/chuva_fraca.svg";
import RainMedium from "../assets/chuva_moderada.svg";
import RainHigh from "../assets/chuva_forte.svg";
import RainVeryHigh from "../assets/chuva_muito_forte.svg";
import FloodZonesPassable from "../assets/alagamento_transitavel.svg";
import FloodZonesNotPassable from "../assets/alagamento_intransitavel.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"),
Passable: FloodZonesPassable,
notPassable: require("../assets/floodZonesAssets/not_passable_icon.png"),
notPassable2: require("../assets/floodZonesAssets/notpassable_2_toggle.png"),
notPassable_toggle: require("../assets/floodZonesAssets/Intransitavel_c.png"),
NotPassable: FloodZonesNotPassable,
},
riverLevel: {
RiverIcon: RiverIcon,

40
src/app/screens/SharingFloodZonesScreen.js

@ -75,28 +75,34 @@ function SharingFloodZonesScreen(props) {
>
<View style={styles.imgs_container}>
<TouchableNativeFeedback onPress={() => setPassable(1)}>
<View
style={styles.img_block}
borderColor={passable == 1 ? colors.primary : colors.white}
>
<View>
{passable == 1 ? (
<Image
source={assets.floodZones.passable_toggle}
style={styles.image}
/>
) : (
<Image
style={styles.image}
source={assets.floodZones.passable}
source={assets.floodZones.passable_2}
/>
<Text style={styles.text}>Transitável</Text>
)}
</View>
</TouchableNativeFeedback>
<TouchableNativeFeedback onPress={() => setPassable(0)}>
<View
style={styles.img_block}
borderColor={passable == 0 ? colors.primary : colors.white}
>
<View style={styles.img_block}>
{passable == 0 ? (
<Image
source={assets.floodZones.notPassable_toggle}
style={styles.image}
source={assets.floodZones.notPassable}
/>
<Text style={styles.text}>Intransitável</Text>
) : (
<Image
style={styles.image}
source={assets.floodZones.notPassable2}
/>
)}
</View>
</TouchableNativeFeedback>
</View>
@ -156,7 +162,7 @@ function SharingFloodZonesScreen(props) {
);
}
const borderWidth = 4;
const dims = scaleDimsFromWidth(150, 80, 42.0);
const dims = scaleDimsFromWidth(93, 106, 30.0);
const styles = StyleSheet.create({
container: {
@ -165,22 +171,20 @@ const styles = StyleSheet.create({
},
image: {
width: dims.width * 0.9,
height: dims.height * 0.9,
width: dims.width,
height: dims.height,
resizeMode: "contain",
},
img_block: {
borderRadius: 5,
padding: 10,
borderStyle: "dotted",
borderColor: colors.white,
borderWidth: borderWidth,
alignItems: "center",
width: dims.width,
},
imgs_container: {
flexDirection: "row",
justifyContent: "space-between",
justifyContent: "space-evenly",
},
text: {

Loading…
Cancel
Save