gabriellopes320
/
WPD-MobileApp
forked from cemaden-educacao/WPD-MobileApp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Refactoring code to use app/config/assets constant for all images 

requires.
master
GabrielTrettel 4 years ago
parent
4741eb6ba8
commit
b0830b2841
6 changed files with 147 additions and 118 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 23
      src/app/config/assets.js
  2. 45
      src/app/hooks/selectFromDB.js
  3. 13
      src/app/screens/RainSharingDataScreen.js
  4. 20
      src/app/screens/RiverFloodSharingDataScreen.js
  5. 13
      src/app/screens/SharingDataScreen.js
  6. 5
      src/app/screens/SharingFloodZonesScreen.js

23
src/app/config/assets.js
View File

@ -0,0 +1,23 @@
export default {
floodZones: {
floodIcon: require("../assets/pontos_alagamento_peq.png"),
passable: require("../assets/floodZonesAssets/passable_icon.png"),
notPassable: require("../assets/floodZonesAssets/not_passable_icon.png"),
},
riverLevel: {
riverIcon: require("../assets/nivel_rio.png"),
low: require("../assets/rio_baixo.png"),
normal: require("../assets/rio_normal.png"),
high: require("../assets/rio_alto.png"),
flooding: require("../assets/rio_transbordando.png"),
},
rainLevel: {
rain_0_5: require("../assets/sem_chuva.png"),
rain_1_5: require("../assets/chuva_fraca.png"),
rain_2_5: require("../assets/chuva_peq.png"),
rain_3_5: require("../assets/chuva_forte.png"),
rain_4_5: require("../assets/chuva_muito_forte.png"),
rain_5_5: require("../assets/chuva_pancadas.png"),
},
pluviometer: require("../assets/diario_pluviometrico.png"),
};

45
src/app/hooks/selectFromDB.js
View File

@ -1,27 +1,28 @@
import { useEffect, useReducer } from "react";
import "../config/globals";
const assets = {
floodZones: require("../assets/pontos_alagamento_peq.png"),
riverLevel: [
require("../assets/rio_baixo.png"),
require("../assets/rio_normal.png"),
require("../assets/rio_alto.png"),
require("../assets/rio_transbordando.png"),
],
import assets from "../config/assets";
const custom_assets = {
pluviometer: assets.pluviometer,
floodZones: assets.floodZones.floodIcon,
riverLevel: ["low", "normal", "high", "flooding"].map((key) => {
return assets.riverLevel[key];
}),
rainLevel: [
require("../assets/sem_chuva.png"),
require("../assets/chuva_peq.png"),
require("../assets/chuva_peq.png"),
require("../assets/chuva_forte.png"),
require("../assets/chuva_muito_forte.png"),
require("../assets/chuva_pancadas.png"),
],
pluviometer: require("../assets/diario_pluviometrico.png"),
"rain_0_5",
"rain_1_5",
"rain_2_5",
"rain_3_5",
"rain_4_5",
"rain_5_5",
].map((key) => {
return assets.rainLevel[key];
}),
};
// NOTE: For debug pourposes
// NOTE: For debug pourposes, every icon will be placed some `offset` from
// another. In final release, offset must be assigned to 0.0
var offset = 0.001;
var displacement = 0;
@ -56,7 +57,7 @@ function partsePluviometer(row) {
latitude: row["Latitude"] + displacement,
longitude: row["Longitude"],
},
image: assets.pluviometer,
image: custom_assets.pluviometer,
description: row["Pluviometer"],
};
}
@ -74,7 +75,7 @@ function parseFloodZones(row) {
latitude: row["Latitude"],
longitude: row["Longitude"] + displacement,
},
image: assets.floodZones,
image: custom_assets.floodIcon,
description: row["Description"],
};
}
@ -94,7 +95,7 @@ function parseRiverLevel(row) {
latitude: row["Latitude"],
longitude: row["Longitude"] + displacement,
},
image: assets.riverLevel[riverIdx],
image: custom_assets.riverLevel[riverIdx],
description: riverLevel[riverIdx],
};
}
@ -121,7 +122,7 @@ function parseRainLevel(row) {
latitude: row["Latitude"],
longitude: row["Longitude"] + displacement,
},
image: assets.rainLevel[rainIdx],
image: custom_assets.rainLevel[rainIdx],
description: rainLevel[rainIdx],
};
}

13
src/app/screens/RainSharingDataScreen.js
View File

@ -12,6 +12,7 @@ import { TouchableNativeFeedback } from "react-native-gesture-handler";
import { insertRainData } from "../database/databaseLoader";
import { showMessage } from "react-native-flash-message";
import { scaleDimsFromWidth } from "../config/dimensions";
import assets from "../config/assets";
const validationSchema = Yup.object().shape({
images: Yup.array().min(1, "Por favor, selecione ao menos uma imagem"),
@ -63,7 +64,7 @@ function RainSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/sem_chuva.png")}
source={assets.rainLevel.rain_0_5}
/>
<Text style={styles.text}>Sem chuva</Text>
</View>
@ -76,7 +77,7 @@ function RainSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/chuva_fraca.png")}
source={assets.rainLevel.rain_1_5}
/>
<Text style={styles.text}>Chuva fraca</Text>
</View>
@ -89,7 +90,7 @@ function RainSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/chuva_peq.png")}
source={assets.rainLevel.rain_2_5}
/>
<Text style={styles.text}>Chuva moderada</Text>
</View>
@ -104,7 +105,7 @@ function RainSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/chuva_forte.png")}
source={assets.rainLevel.rain_3_5}
/>
<Text style={styles.text}>Chuva forte</Text>
</View>
@ -117,7 +118,7 @@ function RainSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/chuva_muito_forte.png")}
source={assets.rainLevel.rain_4_5}
/>
<Text style={styles.text}>Chuva muito forte</Text>
</View>
@ -130,7 +131,7 @@ function RainSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/chuva_pancadas.png")}
source={assets.rainLevel.rain_5_5}
/>
<Text style={styles.text}>Pancada de chuva</Text>
</View>

20
src/app/screens/RiverFloodSharingDataScreen.js
View File

@ -11,7 +11,8 @@ import colors from "../config/colors";
import { TouchableNativeFeedback } from "react-native-gesture-handler";
import { insertRiverData } from "../database/databaseLoader";
import { showMessage } from "react-native-flash-message";
import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
import assets from "../config/assets";
const validationSchema = Yup.object().shape({
images: Yup.array().min(1, "Por favor, selecione ao menos uma imagem"),
@ -39,7 +40,8 @@ function RiverFloodSharingDataScreen(props) {
<KeyboardAwareScrollView
resetScrollToCoords={{ x: 0, y: 0 }}
contentContainerStyle={styles.container}
scrollEnabled={true}>
scrollEnabled={true}
>
<Form
initialValues={{
images: [],
@ -67,7 +69,7 @@ function RiverFloodSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/rio_baixo.png")}
source={assets.riverLevel.low}
/>
<Text style={styles.text}>Baixo</Text>
</View>
@ -80,7 +82,7 @@ function RiverFloodSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/rio_normal.png")}
source={assets.riverLevel.normal}
/>
<Text style={styles.text}>Rio normal</Text>
</View>
@ -88,7 +90,11 @@ function RiverFloodSharingDataScreen(props) {
</View>
<View
style={{ marginTop: 10, flexDirection: "row", justifyContent: "space-around" }}
style={{
marginTop: 10,
flexDirection: "row",
justifyContent: "space-around",
}}
>
<TouchableNativeFeedback onPress={() => setRiverScale(2)}>
<View
@ -97,7 +103,7 @@ function RiverFloodSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/rio_alto.png")}
source={assets.riverLevel.high}
/>
<Text style={styles.text}>Alto</Text>
</View>
@ -110,7 +116,7 @@ function RiverFloodSharingDataScreen(props) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/rio_transbordando.png")}
source={assets.riverLevel.flooding}
/>
<Text style={styles.text}>Transbordando</Text>
</View>

13
src/app/screens/SharingDataScreen.js
View File

@ -7,7 +7,7 @@ import RainSharingDataScreen from "../screens/RainSharingDataScreen";
import SharingFloodZonesScreen from "./SharingFloodZonesScreen";
import PluviometerSharingDataScreen from "./PluviometerSharingDataScreen";
import RiverFloodSharingDataScreen from "./RiverFloodSharingDataScreen";
import assets from "../config/assets";
//1/3
function SharingDataScreen({ navigation }) {
@ -20,7 +20,7 @@ function SharingDataScreen({ navigation }) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/pontos_alagamento_peq.png")}
source={assets.floodZones.floodIcon}
/>
<Text style={styles.text}>Pontos de {"\n"}alagamento</Text>
</TouchableOpacity>
@ -31,7 +31,7 @@ function SharingDataScreen({ navigation }) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/chuva_peq.png")}
source={assets.rainLevel.rain_2_5}
/>
<Text style={styles.text}>Chuva</Text>
</TouchableOpacity>
@ -42,10 +42,7 @@ function SharingDataScreen({ navigation }) {
style={{ alignItems: "center" }}
onPress={() => navigation.navigate("PluviometerSharingData")}
>
<Image
style={styles.floodingLogo}
source={require("../assets/diario_pluviometrico.png")}
/>
<Image style={styles.floodingLogo} source={assets.pluviometer} />
<Text style={styles.text}>Diário do{"\n"}pluviômetro</Text>
</TouchableOpacity>
@ -55,7 +52,7 @@ function SharingDataScreen({ navigation }) {
>
<Image
style={styles.floodingLogo}
source={require("../assets/nivel_rio.png")}
source={assets.riverLevel.riverIcon}
/>
<Text style={styles.text}>Nível de água {"\n"}no rio</Text>
</TouchableOpacity>

5
src/app/screens/SharingFloodZonesScreen.js
View File

@ -12,6 +12,7 @@ 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";
function submitForm(props) {
// console.log(props);
@ -72,7 +73,7 @@ function SharingFloodZonesScreen(props) {
>
<Image
style={styles.image}
source={require("../assets/floodZonesAssets/passable_icon.png")}
source={assets.floodZones.passable}
/>
<Text style={styles.text}>Transitável</Text>
</View>
@ -85,7 +86,7 @@ function SharingFloodZonesScreen(props) {
>
<Image
style={styles.image}
source={require("../assets/floodZonesAssets/not_passable_icon.png")}
source={assets.floodZones.notPassable}
/>
<Text style={styles.text}>Intransitável</Text>
</View>

Write Preview
Loading…
Cancel
Save