diff --git a/src/app/screens/MapFormScreen.js b/src/app/screens/MapFormScreen.js
index 9228714..3a37dbf 100644
--- a/src/app/screens/MapFormScreen.js
+++ b/src/app/screens/MapFormScreen.js
@@ -1,44 +1,47 @@
import React, { useContext, useState } from "react";
-import { Button, StyleSheet, View, Text } from "react-native";
-import MapView, { Marker } from "react-native-maps";
+import { StyleSheet, View, Text, Image } from "react-native";
+import MapView from "react-native-maps";
import colors from "../config/colors";
import { screen_width, screen_height } from "../config/dimensions";
-import * as Location from 'expo-location';
+import * as Location from "expo-location";
import { EventLocationContext } from "../context/EventLocationContext";
import { TouchableOpacity } from "react-native-gesture-handler";
import { CurrentLocationContext } from "../context/CurrentLocationContext";
-
-//Implementação posterior: É interessante adcionar um searchBox para que o usuário busque um endereço (google places autocomplete é uma api paga)
+// NOTE: Implementação posterior: É interessante adcionar um searchBox para que o usuário busque um endereço (google places autocomplete é uma api paga)
const MapFormScreen = (props) => {
- const context = useContext(EventLocationContext); //local do evento
- const contextLocation = useContext(CurrentLocationContext) //local do usuário
- const location = contextLocation.currentCoordinates;
+ const context = useContext(EventLocationContext); //local do evento
+ const contextLocation = useContext(CurrentLocationContext); //local do usuário
const [marker, setMarker] = useState(context.eventCoordinates);
- // console.log(marker);
const getAddress = async (coordenadas) => {
Location.setGoogleApiKey("AIzaSyD_wuuokS3SVczc8qSASrsBq0E5qIpdyMc");
const address = await Location.reverseGeocodeAsync(coordenadas);
if (address[0] != undefined) {
- context.saveNewLocation(address[0].street + ", " + address[0].name + "\n" + address[0].district, coordenadas);
- }
- else{//Quando o usuário não da permissão de acesso da localização o geoCode retorna um array vazio
+ context.saveNewLocation(
+ address[0].street +
+ ", " +
+ address[0].name +
+ "\n" +
+ address[0].district,
+ coordenadas
+ );
+ } else {
+ //Quando o usuário não da permissão de acesso da localização o geoCode retorna um array vazio
context.saveNewLocation("Erro ao carregar endereço", coordenadas);
}
- }
+ };
const setLocation = () => {
getAddress(marker);
props.navigation.goBack(null);
- }
+ };
- // console.log(markers);
const map_scale = 0.003;
const lat_long_delta = {
latitudeDelta: map_scale,
@@ -52,7 +55,7 @@ const MapFormScreen = (props) => {
showsUserLocation={true}
initialRegion={{
latitude: -23.533773,
- longitude: -46.625290,
+ longitude: -46.62529,
...lat_long_delta,
}}
region={{
@@ -60,30 +63,35 @@ const MapFormScreen = (props) => {
longitude: marker.longitude,
...lat_long_delta,
}}
+ onRegionChangeComplete={(r) => {
+ console.log(r);
+ setMarker({ latitude: r.latitude, longitude: r.longitude });
+ }}
+ >
+
+
+
+
-
- setMarker({ x: e.nativeEvent.coordinate }.x)
- }
- >
-
-
- setLocation()}>
+ setLocation()}>
Confirmar
-
);
-}
+};
const styles = StyleSheet.create({
container: {
@@ -107,12 +115,25 @@ const styles = StyleSheet.create({
marginVertical: 10,
textAlign: "center",
},
+ markerFixed: {
+ left: "50%",
+ marginLeft: -24,
+ marginTop: -48,
+ position: "absolute",
+ top: "50%",
+ height: 48,
+ width: 48,
+ },
text: {
color: colors.white,
fontSize: 16,
textTransform: "uppercase",
fontWeight: "bold",
},
+ marker: {
+ height: 48,
+ width: 48,
+ },
});
export default MapFormScreen;