Merge branch 'main' of github.com:IGSD-UoW/WPD-MobileApp

src/app/screens/PluviometerDiaryScreen.js

@@ -1,17 +1,10 @@
-import React, { useState, useContext, useEffect } from "react";
+import React from "react";
 import { StyleSheet, Text, View } from "react-native";
 
 import Screen from "../components/Screen";
 import { dimensions, scaleDimsFromWidth } from "../config/dimensions";
 import colors from "../config/colors/";
-import {
-    LineChart,
-    BarChart,
-    PieChart,
-    ProgressChart,
-    ContributionGraph,
-    StackedBarChart
-} from "react-native-chart-kit";
+import { LineChart } from "react-native-chart-kit";
 
 import { FontAwesome5 } from '@expo/vector-icons';
 import { MaterialIcons } from "@expo/vector-icons";
@@ -19,26 +12,20 @@ import { Dimensions } from "react-native";
 
 
 const dims = scaleDimsFromWidth(85, 85, 25);
+const screenWidth = (Dimensions.get("window").width) * 0.95;
+const screenHeight = Dimensions.get('window').height * 0.30;
 
-
-function PluviometerDiaryScreen(props) {
-    //Substituir por dados vindos da API
-    const school = "Escola registrada do pluviômetro";
-    const profile = "Tipo de perfil do usuário";
-    const local = "Endereço registrado do pluviômetro"
-
-    const screenWidth = Dimensions.get("window").width;
-
-const data = {
-    labels: ["January", "February", "March", "April", "May"],
+const data = { //substituir por dados da API
+    labels: ["01/01", "01/02", "01/03", "01/04", "01/05"],
     datasets: [
         {
-            data: [0, 10, 20, 35, 40, 60],
-            color: () => colors.gold, // optional
-            strokeWidth: 2 // optional
+            data: [0, 10, 20, 25, 5 ],
+            color: () => colors.gold, 
+            strokeWidth: 2,
         }
     ],
-    legend: ["Registros pluviometricos"] // optional
+
+    legend: ["Registros pluviométricos"] 
 };
 const chartConfig = {
     backgroundGradientFrom: 0,
@@ -47,22 +34,32 @@ const chartConfig = {
     backgroundGradientToOpacity: 0,
     color: () => colors.primary,
     strokeWidth: 2, // optional, default 3
-    barPercentage: 0.5,
-    useShadowColorFromDataset: false // optional
+    useShadowColorFromDataset: true,   
+    propsForLabels: {
+        fontSize: 12,        
+    } 
+    
 };
 
 
+function PluviometerDiaryScreen(props) {
+    //Substituir por dados vindos da API
+    const school = "Escola registrada do pluviômetro";
+    const profile = "Tipo de perfil do usuário";
+    const local = "Endereço registrado do pluviômetro";
 
     return (
         <Screen style={styles.container}>
-            <View style={{ flex: 1 }}>
+            <View style={{ flex: 1, alignItems: "center", flexDirection: "row"}}>
                 <LineChart
                     data={data}
                     width={screenWidth}
-                    height={200}
+                    height={screenHeight}
                     chartConfig={chartConfig}
                     withVerticalLines={false}
+                    yAxisSuffix="mm"
                 />
+                <Text style={{ textAlign:"center" }}>Data</Text>
             </View>
             <View
                 style={{

src/package-lock.json

@@ -16819,6 +16819,14 @@
         }
       }
     },
+    "react-navigation-header-buttons": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/react-navigation-header-buttons/-/react-navigation-header-buttons-7.0.1.tgz",
+      "integrity": "sha512-ggIXhshnRv3Kaqw1ZlZLqMPtBOsLY4FLxxEOCHKe/XuWVfZGPmMqZBC/S4H8cQgIGRyFNOrypXF69Hb7fXMWNg==",
+      "requires": {
+        "invariant": ">=2"
+      }
+    },
     "react-navigation-tabs": {
       "version": "2.10.1",
       "resolved": "https://registry.npmjs.org/react-navigation-tabs/-/react-navigation-tabs-2.10.1.tgz",