creating navigation to pluviometer register screen

src/app/navigation/AccountNavigator.js

@@ -1,11 +1,13 @@
 import React from "react";
 import { createStackNavigator } from "@react-navigation/stack";
 import AccountScreen from "../screens/AccountScreen";
+import PluviometerRegisterScreen from '../screens/PluviometerRegisterScreen';
+import MapFormScreen from "../screens/MapFormScreen";
 
 const Stack = createStackNavigator();
 
 const AccountNavigator = () => (
-  <Stack.Navigator>
+  <Stack.Navigator initialRouteName="Perfil">
     <Stack.Screen
       name="Perfil"
       component={AccountScreen}
@@ -16,6 +18,27 @@ const AccountNavigator = () => (
         },
       }}
     />
+
+    <Stack.Screen
+      name="PluviometerRegister"
+      component={PluviometerRegisterScreen}
+      options={{
+        title: "PluviometerRegister",
+        headerStyle: {
+          backgroundColor: "white",
+        },
+      }}
+    />
+    <Stack.Screen
+      name="FormMap"
+      component={MapFormScreen}
+      options={{
+        title: "Voltar",
+        headerStyle: {
+          backgroundColor: "white",
+        },
+      }}
+    />
   </Stack.Navigator>
 );
 

src/app/screens/AccountScreen.js

@@ -1,11 +1,20 @@
 import React, { useContext } from "react";
-import { Text, Button } from "react-native";
+import { Text, Button, Image, View } from "react-native";
 import Screen from "../components/Screen";
 import InDevelopment from "../components/InDevelopment";
 import { AuthContext } from "../auth/context";
 import authStorage from "../auth/storage";
+import { TouchableOpacity } from "react-native-gesture-handler";
+import assets from "../config/assets";
+
+import { scaleDimsFromWidth, dimensions } from "../config/dimensions";
+import colors from "../config/colors";
+
+
 
 function handleLogOut(setUser) {
+
+
   setUser(null);
   authStorage.removeToken();
 }
@@ -13,21 +22,48 @@ function handleLogOut(setUser) {
 function AccountScreen(props) {
   const { user, setUser } = useContext(AuthContext);
 
+  const dims = scaleDimsFromWidth(93, 106, 35);
+
   return (
     <Screen
       style={{
         padding: 10,
+        fleex: 1,
       }}
     >
       <Text>{user.name}</Text>
       <Text>{user.email}</Text>
+
+      <TouchableOpacity onPress={()=> props.navigation.navigate("PluviometerRegister")}>
+        <View style={{
+          flexDirection: "row",
+          justifyContent: "flex-start",
+          alignContent: "center",
+          paddingTop: 40
+        }}>
+          <Image
+            style={{ width: 28 }}
+            resizeMode="contain"
+            source={require("../assets/pluviometer/pluviometro.png")}
+          />
+          <View style={{ justifyContent: "center" }}>
+            <Text style={{
+              fontSize: dimensions.text.default,
+              fontWeight: "bold"
+            }}>
+              Cadastrar Pluviômetro
+              </Text>
+          </View>
+        </View>
+      </TouchableOpacity>
+      <View style={{ paddingTop: 40 }}>
         <Button
-        style={{ paddingTop: 10 }}
           title="Logout"
           onPress={() => {
             handleLogOut(setUser);
           }}
         />
+      </View>
 
       {/* <InDevelopment /> */}
     </Screen>

src/app/screens/PluviometerRegisterScreen.js

@@ -13,6 +13,7 @@ import moment from "moment";
 import FormLocationPicker from "../components/forms/FormLocationPicker";
 import { EventLocationContext } from "../context/EventLocationContext";
 import SchoolPicker from "../components/SchoolPicker";
+import { TouchableOpacity } from "react-native-gesture-handler";
 
 
 
@@ -59,24 +60,34 @@ function PluviometerRegisterScreen(props) {
                     <View style={{ flex: 0.10 }}>
                         <Text style={styles.title}>Cadastro do Pluviômetro</Text>
                     </View>
+
                     {/* Escola: */}
-                    <View style={{ flex: 0.30 }}>
+                    <View style={{ flex: 0.25, marginTop: 5}}>
                         <Text style={styles.label}>Escola: </Text>
                         <SchoolPicker
                             itemSelected={(value) => setSchool(value)} />
                     </View>
+
+                    <View style={{
+                        flex: 0.60, flexDirection: "column"
+                    }}>
+                        <ScrollView contentContainerStyle={{
+                            flexGrow: 1
+                        }}>
                             <View style={{
-                        flex: 0.60, flexDirection: "column",
+                                flex: 1,
+                                flexDirection: "column",
                                 justifyContent: "space-between"
                             }}>
-                        <ScrollView  contentContainerStyle={{ flexGrow: 1,flexDirection: "column",
-                        justifyContent: "space-between" }}>
-
                                 {/*Local do pluvioômetro:*/}
+                                <View style={{ flex: 1 }}>
+                                    <TouchableOpacity onPress={() => props.navigation.navigate("FormMap")}>
                                         <View style={{ flex: 1 }}>
                                             <Text style={styles.label}>Endereço do pluviômetro: </Text>
                                             <FormLocationPicker subtitle="Defina o endereço do pluviômetro" />
                                         </View>
+                                    </TouchableOpacity>
+                                </View>
 
                                 {/*Data de cadastro:*/}
                                 <View style={{ flex: 1 }}>
@@ -84,7 +95,7 @@ function PluviometerRegisterScreen(props) {
                                         fontSize: dimensions.text.secondary,
                                         fontWeight: "bold",
                                         textAlign: "left",
-                                    color: colors.lightBlue, marginBottom: 10
+                                        color: colors.lightBlue,
                                     }}>Data do cadastro: </Text>
                                     <FormDatePicker
                                         disabled={true}
@@ -99,9 +110,10 @@ function PluviometerRegisterScreen(props) {
                                     />
                                 </View>
 
-                            <View style={{ flex: 0.10, marginTop:15 }}>
+                                <View style={{ flex: 0.05, marginTop: 15 }}>
                                     <SubmitButton title="Cadastrar" alignContent="flex-end" />
                                 </View>
+                            </View>
                         </ScrollView>
                     </View>
                 </View>