Xamarin.Forms Maps

Xamarin.Forms Maps, allows you to display a map inside your Xamarin.Forms application. You can see a map of your current location, place pins on the map, and also provide a route between two locations. I have a sample repo at XamarinMaps, if you want to see a complete solution.

Setup

To setup your projects, first install the Xamarin.Forms.Maps nuget package into all of your projects, including your Class Library.

Android

Place this in your MainActivity.cs, just below Xamarin.Forms.Forms.Init(this, bundle);

FormsMaps.Init(this, bundle);

iOS

Place this in your AppDelegate.cs, just below Xamarin.Forms.Forms.Init();

FormsMaps.Init();

UWP

Place this in your App.xaml.cs, just below Xamarin.Forms.Forms.Init(e);

FormsMaps.Init("AUTHENTICATION_TOKEN");

I will mention how, to get this authentication token next, along with other configuration needed.

Note: You will need to generate an API Key for your Debug and Release versions of your app.

You will also need to ensure, you enable these permissions.

ACCESS_COARSE_LOCATION

ACCESS_FINE_LOCATION

ACCESS_LOCATION_EXTRA_COMMANDS

ACCESS_MOCK_LOCATION

ACCESS_NETWORK_STATE

ACCESS_WIFI_STATE

INTERNET

iOS

iOS uses Apple Maps, and it is common knowledge that they aren’t as good as Google Maps. If you are displaying a simple map, doing a simple route or dropping a few pins, Apple Maps should suffice. If you are doing something complicated, you might want to use Google Maps. Using Google Maps on iOS is out of the scope of this post, but you can use the Xamarin.Forms.GoogleMaps Nuget package to achieve this.

For iOS 8 and above, you need to add some values into your Info.plist. This is to comply with permission dialogs, when iOS tries to load the map.

<key>NSLocationAlwaysUsageDescription</key>
<string>AppName wants to use your location for ...?</string>
<key>NSLocationWhenInUseUsageDescription</key>
<string>AppName is using your location.</string>

UWP

UWP uses Bing Maps. You will need to create an Authentication Token. Follow the instructions in Request a maps authentication key, and replace the string in the FormMaps.Init(“AUTHENTICATION_TOKEN”);.

Go to your Package.appxmanifest and in the Capabilities tab, set the Location permission.

Bindable Map Control

The default maps control, doesn’t contain many nice bindable properties. Hence, lets create a new Map control, with some bindable properties. These will add Pins to the map, and center the map to a particular position.

Current Location

To show the map at your current location, you will need to get the location from your mobile device and pass it to the map. I recommend installing the Geolocator plugin, to retrieve this information. Once installed, follow the instructions to ensure you have the correct permissions setup.

Place a Pin

If you want to place a pin on the map, this is easy. Bind the MapPins property to your ViewModel, and add as many pins as you want. Create a property in your ViewModel and bind to MapPins in BindableMap.

Xamarin has documentation on how to customize a map pin, if you further want to integrate the map into your app.

Create a Route

If you want to create a route between two locations on your map, this can be done. It does require custom renderers and a bit more effort. Xamarin has the full documentation and samples in Highlighting a Route on a Map.

XAMARIN WEEKLY NEWSLETTER

Subscribe to a hand-picked round up of the best Xamarin development links every week. Published every Friday. Free.

Related Posts

2 Comments

Hello, I have a problem in Xamarin.IOS. Actually, I am getting possible addresses to the current location in Xamarin.Android. See the below code….I am getting the list of possible addresses in “list_of_addresses ” variable in Android,But, In IOS, getting different data in this same variable while debugging.

please solve this issue ASAP.and please provide the solution for “How to get possible addresses (nearest locations) to the current address.”
——————————————————————————