How to use MapView in Xamarin.Forms

Xamarin.Forms
img_xamarin

Xamarin.Forms.Maps uses the native map APIs on each platform. This provides a fast, familiar maps experience for users, but means that some configuration steps are needed to adhere to each platforms specific API requirements. Once configured, the Map control works just like any other Xamarin.Forms element in common code.

Let’s started:
First of all create a new solution Name it MapViewXamamrinForms

Now in solution we have 3 projects (for android, for ios and common) now we have to add package call Xamarin.Forms.Maps in all the 3 projects from Nuget packages and to add right click on Package and then select add package and then search or browse the package and select add Button.

xf11.1

Now we have to add Xamarin.FormsMaps.Init() after Xamarin.Forms.Forms.Init()
in
• iOS – AppDelegate.cs file, in the Finished Launching method.
• Android – MainActivity.cs file, in the OnCreate method.

Now Lets Start with IOS:

On ios7 it will work fine but for ios8 we have to add following plist in info.plist

Now we have to add Following code in our content page and do not forgot to define namespace using Xamarin.Forms.Maps

Now just build the project with ios and it will look like as follows

xf11.2

Now let’s start with android:

Map in android is takes some extra work then ios first of all we have to get ApiKey for the project and mention it in our AndroindMenifest.xaml file and to generate ApiKey first we have to generate SHA-1 Key using keytool and debug.Keystorfile for that start your terminal and move to

and then execute following command in terminal

It will show you SHA-1 Key just copy it and openGoogle APIs Console

xf11.5

Click on create new project and enter project name and project id and click on create once the project is created it will redirect you on project dashboard form there select Api&auth and from there just turn on Google Maps Android Api V2

xf11.4

And then to Obtain Api key click on credential then click on create new key button and select android key now enter your SHA-1 key and then semicolon and your package name (ex: kfjhkjfhjkfh;pkg_name)

xf11.5

click on create and copy your ApiKey

xf11.6

Now we have to add this api key and some permission to our AndroidMenifest.xml file

Nowbuildyour android app and run it in simulator.

If you like this tutorial then you can download full copy of the code from github

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">