Open A Specific Location Using Maps In Xamarin.Forms Application Using Xamarin.Essentials

The Maps class is available in Xamarin.Essentials API. It is used to open the installed Maps application to a specific location or placemark. Android, iOS, and UWP offer unique operating systems and platform APIs that developers can have access to all in C# leveraging Xamarin. Xamarin.Essentials provides a single cross-platform API that works with any Xamarin.Forms, Android, iOS, or UWP application that can be accessed from shared code no matter how the user interface is created.

Reading this article, you can learn how to open the installed Maps application to a specific location or placemark in Xamarin.Forms application using Xamarin Essentials for Android and Universal Windows Platform with XAML and Visual C# in cross-platform application development.

The following important tools are required for developing Xamarin Forms App,

  1. Windows 10 (Recommended)
  2. Visual Studio 2017
  3. Android API 19 or higher and UWP 10.0.16299.0 or higher.

Now, we can discuss step by step App development.

Step 1

Open Visual Studio 2017 -> Start -> New Project-> Select Cross-Platform (under Visual C#-> Mobile App (Xamarin.Forms)-> Give the Suitable Name for your App (XamFormMaps) ->OK.

Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 

Step 2

Select the Cross-Platform template as a Blank APP ->Set Platform as Android and UWP and code sharing strategy as .NET standard. Afterward, Visual Studio creates 3 projects (Portable, Android, UWP).

Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 

Step 3

For adding a reference, right-click your solution (XamFormMaps) and select "Manage NuGet Packages".

For adding Xamarin.Essentials reference, choose Browse and search for Xamarin.Essentials. Select the package and select all the projects (portable, Android, UWP) and install it.

Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 

Step 4

Add the Label, Entry, and Button controls in Mainpage.Xaml for Title, Latitude, Longtitude, and Name.

  1. <Label FontAttributes="Bold" Text=" Open a Specific location using Maps in Xamarin Forms application using Xamarin Essentials for Android and UWP" VerticalOptions="Center" HorizontalOptions="Center" />  
  2. <Entry x:Name="entLong" Placeholder="Enter the Longtitude here" />  
  3. <Entry x:Name="entLat" Placeholder="Enter the Latitude here" />  
  4. <Entry x:Name="entName" Placeholder="Enter the Name of the location here" />  
  5. <Button x:Name="btnclick" Text="Click" Clicked="btn_clicked" />  

Step 5

Add the following code in MainActivity.cs in XamFormMaps.Android project.

In onCreate() method.

  1. Xamarin.Essentials.Platform.Init(this, savedInstanceState);  

Also, add the below method.

  1. publicoverridevoid OnRequestPermissionsResult(int requestCode, string[] permissions, [GeneratedEnum] Android.Content.PM.Permission[] grantResults) {  
  2.     Xamarin.Essentials.Platform.OnRequestPermissionsResult(requestCode, permissions, grantResults);  
  3.     base.OnRequestPermissionsResult(requestCode, permissions, grantResults);  
  4. }  

Step 6

Add the following namespace and code in Mainpage.Xaml.cs.

  1. using Xamarin.Essentials;  
  2. publicvoid btn_clicked(object sender, System.EventArgs e) {  
  3.     var location = new Location(Convert.ToDouble(entLat.Text), Convert.ToDouble(entLong.Text));  
  4.     var options = new MapsLaunchOptions {  
  5.         Name = entName.Text  
  6.     };  
  7.     Maps.OpenAsync(location, options);  
  8. }  

Note
Automatically, the following code will be generated in XAML code view, while we are done in the design view.

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:XamFormMaps" x:Class="XamFormMaps.MainPage">  
  3.     <StackLayout>  
  4.         <Label FontAttributes="Bold" Text=" Open a Specific location using Maps in Xamarin Forms application using Xamarin Essentials for Android and UWP" VerticalOptions="Center" HorizontalOptions="Center" />  
  5.         <Entry x:Name="entLong" Placeholder="Enter the Longtitude here" />  
  6.         <Entry x:Name="entLat" Placeholder="Enter the Latitude here" />  
  7.         <Entry x:Name="entName" Placeholder="Enter the Name of the location here" />  
  8.         <Button x:Name="btnclick" Text="Click" Clicked="btn_clicked" />  
  9.     </StackLayout>  
  10. </ContentPage>  

Step 7

Deploy your app in UWP and Android. The output of the XamFormMaps App is.

Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 
 
Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 
 
After entering Longitude, Latitude, and Name -
 
Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 
 
Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 
 
After clicking the Click button - 
 
Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 
 
Open A Specific Location Using Maps In Xamarin Forms Application Using Xamarin Essentials For Android And UWP 
 
Summary

Now, you have successfully opened the specific location using Maps in Xamarin.Forms application using Xamarin.Essentials for Android and Universal Windows Platform using Visual C# and Xamarin.


Similar Articles