
<h2>How to setup Google Map at Xamarin.Form project</h2>
<p>
  To use Google Map at Xamarin.Form, you'll need register google API account to
  get the key, add use permission on android's AndroidManifest.xml file, then
  add code to use.
</p>
<h3>Nuget package file at Xamarin.Form project</h3>
<pre class="language-xml">
&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;packages&gt;
  &lt;package id="Xamarin.Forms" version="2.3.3.180" targetFramework="portable45-net45+win8+wp8+wpa81" /&gt;
  &lt;package id="Xamarin.Forms.Maps" version="2.3.3.180" targetFramework="portable45-net45+win8+wp8+wpa81" /&gt;
&lt;/packages&gt;
</pre>
<h3>Start file, app.xaml.cs</h3>
<pre class="language-csharp">
using Xamarin.Forms;

namespace MapExample1
{
    public partial class App : Application
    {
        public static double ScreenHeight;
        public static double ScreenWidth;
        public App()
        {
            InitializeComponent();

            MainPage = new MapExample1.MapPage();
        }

        protected override void OnStart()
        {
            // Handle when your app starts
        }

        protected override void OnSleep()
        {
            // Handle when your app sleeps
        }

        protected override void OnResume()
        {
            // Handle when your app resumes
        }
    }
}

</pre>
<h3>xaml file for develop google map</h3>
<pre class="language-xml">
&lt;?xml version="1.0" encoding="utf-8" ?&gt;
&lt;ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              xmlns:local="clr-namespace:MapExample1;assembly=MapExample1"
             x:Class="MapExample1.MapPage"&gt;
  &lt;ContentPage.Content&gt;
    &lt;local:CustomMap x:Name="customMap" MapType="Street" WidthRequest="{x:Static local:App.ScreenWidth}" HeightRequest="{x:Static local:App.ScreenHeight}" /&gt;
  &lt;/ContentPage.Content&gt;
&lt;/ContentPage&gt;
</pre>
<h3>Map MapPage.xaml.cs code</h3>
<pre class="language-csharp">
using System.Collections.Generic;
using Xamarin.Forms;
using Xamarin.Forms.Maps;

namespace MapExample1
{
    public partial class MapPage : ContentPage
    {
        public MapPage()
        {
            InitializeComponent();

            var pin = new CustomPin
            {
                Pin = new Pin
                {
                    Type = PinType.Place,
                    Position = new Position(40.689249, -74.044500),
                    Label = "The Statue of Liberty in New York, USA",
                    Address = "New York, NY 10004",
                   
                },
                Id = "Xamarin",
                Url = "http://xamarin.com/about/",
                
            };

            customMap.CustomPins = new List&lt;CustomPin&gt; { pin };
            customMap.Pins.Add(pin.Pin);
            customMap.MoveToRegion(MapSpan.FromCenterAndRadius(new Position(40.689249, -74.044500), Distance.FromMiles(1.0)));
        }
    }
}
</pre>
<h3>Custom class for map object</h3>
<pre class="language-csharp">
using Xamarin.Forms.Maps;

namespace MapExample1
{
    public class CustomPin
    {
        public Pin Pin { get; set; }

        public string Id { get; set; }

        public string Url { get; set; }
    }
}

using System.Collections.Generic;
using Xamarin.Forms.Maps;

namespace MapExample1
{
    public class CustomMap : Map
    {
        public List CustomPins { get; set; }
    }
}
</pre>
<h2>
  Above are all the sample code you need at Xamarin.Form project, but you also
  need following if you want to run on Android.
</h2>
<h3>Xmarin.Form Android - nuget package file</h3>
<pre class="language-xml">
&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;packages&gt;
  &lt;package id="Xamarin.Android.Support.Animated.Vector.Drawable" version="23.3.0" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Android.Support.Design" version="23.3.0" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Android.Support.v4" version="23.3.0" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Android.Support.v7.AppCompat" version="23.3.0" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Android.Support.v7.CardView" version="23.3.0" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Android.Support.v7.MediaRouter" version="23.3.0" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Android.Support.v7.RecyclerView" version="23.3.0" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Android.Support.Vector.Drawable" version="23.3.0" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Forms" version="2.3.3.180" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.Forms.Maps" version="2.3.3.180" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.GooglePlayServices.Base" version="29.0.0.1" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.GooglePlayServices.Basement" version="29.0.0.1" targetFramework="monoandroid60" /&gt;
  &lt;package id="Xamarin.GooglePlayServices.Maps" version="29.0.0.1" targetFramework="monoandroid60" /&gt;
&lt;/packages&gt;
</pre>
<h3>Android - AndroidManifest.xml</h3>
<p>
  This is the important part, if you want to use Google API, you have to create
  API key and replace to following, also, add use permission to use.
</p>
<pre class="language-xml">
&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;manifest xmlns:android="http://schemas.android.com/apk/res/android"&gt;
	&lt;uses-sdk android:minSdkVersion="15" /&gt;
	&lt;application android:label="MapExample1"&gt;
		&lt;meta-data android:name="com.google.android.geo.API_KEY" android:value="{Go to your google API to get a key and replace here.}" /&gt;
	&lt;/application&gt;
	&lt;!-- Google Maps for Android v2 requires OpenGL ES v2 --&gt;
	&lt;uses-feature android:glEsVersion="0x00020000" android:required="true" /&gt;
	&lt;uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" /&gt;
	&lt;uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" /&gt;
	&lt;uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" /&gt;
	&lt;uses-permission android:name="android.permission.ACCESS_MOCK_LOCATION" /&gt;
	&lt;uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /&gt;
	&lt;uses-permission android:name="android.permission.ACCESS_WIFI_STATE" /&gt;
	&lt;uses-permission android:name="android.permission.INTERNET" /&gt;
	&lt;!-- Google Maps for Android v2 will cache map tiles on external storage --&gt;
	&lt;uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /&gt;
	&lt;!-- Allow the application to access Google web-based services. --&gt;
	&lt;uses-permission android:name="com.google.android.providers.gsf.permission.READ_GSERVICES" /&gt;
&lt;/manifest&gt;
</pre>
<h2>That's it, all the code to run google map on Xamarin.</h2>
<p>
  <img
    class="img-responsive"
    src="https://d1p0mp3f1fx0hz.cloudfront.net/_i9aa29xwa.png"
    alt=""
  />
</p>


This blog shows how to set up Google Map at Xamarin.Form project.

Category GoogleAPI

Xamarin - Use Google Map