add marker to HouseLocation

components/HouseLocation.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import {StyleSheet, View} from 'react-native';
-import MapView, {PROVIDER_GOOGLE} from 'react-native-maps'; // remove PROVIDER_GOOGLE import if not using Google Maps
+import {StyleSheet, View, Text} from 'react-native';
+import MapView, {PROVIDER_GOOGLE, Marker, Callout} from 'react-native-maps'; // remove PROVIDER_GOOGLE import if not using Google Maps
 const styles = StyleSheet.create({
   container: {
     ...StyleSheet.absoluteFillObject,
@@ -16,18 +16,44 @@ const styles = StyleSheet.create({
   },
 });
 
-const HouseLocation = () => (
-  <View style={styles.container}>
-    <MapView
-      provider={PROVIDER_GOOGLE} // remove if not using Google Maps
-      style={styles.map}
-      region={{
-        latitude: 37.78825,
-        longitude: -122.4324,
-        latitudeDelta: 0.015,
-        longitudeDelta: 0.0121,
-      }}
-    />
-  </View>
-);
+const HouseLocation = () => {
+  const [marker, setMarker] = React.useState({
+          latitude: 37.78825,
+          longitude: -122.4324,
+	});
+  return (
+    <View style={styles.container}>
+      <MapView
+        provider={PROVIDER_GOOGLE} // remove if not using Google Maps
+        style={styles.map}
+        initialRegion={{
+          latitude: 37.78825,
+          longitude: -122.4324,
+          latitudeDelta: 0.015,
+          longitudeDelta: 0.0121,
+        }}>
+        <Marker
+          coordinate={marker}
+          draggable={true}
+					onDragEnd = {(e) => {
+						setMarker({
+							latitude: e.nativeEvent.coordinate.latitude,
+							longitude: e.nativeEvent.coordinate.longitude,
+
+						})
+						
+
+
+					}}
+        >
+	<Callout>
+					<Text>{marker.latitude.toFixed(3)}, {marker.longitude.toFixed(3)}</Text>
+
+
+				</Callout>
+				</Marker>
+      </MapView>
+    </View>
+  );
+};
 export default HouseLocation;