Components

Map

<Map />

Constructor

# <Map />

The screen component containing the react-native-maps Map and all related functionality.

View Source src/components/Map.tsx, line 19

Members

# inner constant followUserState

Flag that determines whether the map should focus and follow the user's location.

View Source src/components/Map.tsx, line 54

# inner constant lmAddVisibleState

Holds the visibility state of the AddLandmark modal.

View Source src/components/Map.tsx, line 33

# inner constant lmDetailsEditingState

Flag that toggles whether or not editing is enabled in the LandmarkDetails modal. The parent Map component has access to it so that it can disable closing the modal on backdrop press when it is enabled.

View Source src/components/Map.tsx, line 44

# inner constant lmDetailsVisibleState

Holds the visibility state of the LandmarkDetails modal.

View Source src/components/Map.tsx, line 38

# inner constant mapRef

Ref that holds the loaded MapView instance.

View Source src/components/Map.tsx, line 61

# inner constant newLandmarkState

State that contains the new Landmark object which is passed down to the AddLandmark modal.

View Source src/components/Map.tsx, line 23

# inner constant selectedLandmarkState

State that contains the selected Landmark object which is passed down to the LandmarkDetails modal.

View Source src/components/Map.tsx, line 28

# inner constant userLocationState

State that holds a UserLocation object retrieved from location services.

View Source src/components/Map.tsx, line 49

Methods

# static openAddLandmark()

Opens the AddLandmark modal when the user creates newLandmarkState by longpressing the map. Embedded in a useEffect hook that listens to newLandmarkState.

View Source src/components/Map.tsx, line 98

# async static requestLocationPermissions()

Prompts user to give permission to track their location using expo-location. If permission is granted, user location will be retrieved and stored in userLocationState.

View Source src/components/Map.tsx, line 68

# inner flyToUser()

Animates the map to fly over to and focus on the user's location.

View Source src/components/Map.tsx, line 123

# inner focusLandmark()

Triggered by on a Landmark displayed on the map. Sets selectedLandmark to the pressed Landmark object's value and toggles the LandmarkDetails modal.

View Source src/components/Map.tsx, line 116

# inner promptAddLandmark()

Triggered by long pressing on the map. Sets newLandmarkState to a skeleton Landmark object that only contains the pressed coordinates. Triggers openAddLandmark via useEffect because the asyncronous nature of useState does not set the coordinates fast enough to toggle the modal directly through this method.

View Source src/components/Map.tsx, line 89