Get location coordinates with windows phone application

Location API

You can use Windows Phone’s location API if your windows phone application needs location of user. In this post we will see how to use location API.

Let’s code

Getting started by creating new windows phone application.


Double click on ‘WMAppManifest.xml’ file.(You can read here for more details.) You will find this file inside projects Properties.


Go to Capabilities tab and then select ‘ID_CAP_LOCATION’ capability. This will tell to Windows Phone Store that this application need access to users location. While installing application user will see prompt message about the need of location service. This is the first step of get permission to access location from the user.


We need some user interface to show location status. Copy the following code block inside the default grid created by visual studio template.


    <Button x:Name="btnGetLocation" Click="btnGetLocation_Click">Get Location</Button> 
    <TextBlock x:Name="txtLatitude"></TextBlock> 
    <TextBlock x:Name="txtLongitude"></TextBlock> 
    <TextBlock x:Name="txtStatus"></TextBlock> 

Finally your XAML code and designer will looks like this.


Code behind

Go to MainPage.xaml.cs and add following method

protected override void OnNavigatedTo(NavigationEventArgs e) 
 if (IsolatedStorageSettings.ApplicationSettings.Contains("LocationPermission")) 
 //// User already allowed app to access location 
 //// User not allowed app to access location 
 //// Ask user to allow

 MessageBoxResult result = 
 MessageBox.Show("Application needs your location. Please allow.",  "Location", MessageBoxButton.OKCancel);
 if (result == MessageBoxResult.OK) 
   //// If user allows to access location 
   IsolatedStorageSettings.ApplicationSettings["LocationPermission"] = true; 
    //// If user not allows to access location 
    IsolatedStorageSettings.ApplicationSettings["LocationPermission"] =    false; 

User will navigate to the MainPage.xaml page when he open application. At this time OnNaviatedTo method get called. This method first check user already set permission to access location.(No check here if he accepted or rejected location access request. We will check it later).

If user has not given permission to access location, we will show Ok Cancel message box of asking the permission to access location. If he responds with Ok, we will store the value of ‘LocationPermission’ key as true else false if user select Cancel option.


Get Location

Below is the button click event handler. Copy code and paste it below to above method.

private async void btnGetLocation_Click(object sender, RoutedEventArgs e) 
 if (!(bool)IsolatedStorageSettings.ApplicationSettings["LocationPermission"]) 
 Geolocator geolocator = new Geolocator(); 
 geolocator.DesiredAccuracyInMeters = 50;

   Geoposition geoposition = await geolocator.GetGeopositionAsync( 
   maximumAge: TimeSpan.FromMinutes(10), 
   timeout: TimeSpan.FromSeconds(10) 

   txtLatitude.Text = "Latitude: " +       geoposition.Coordinate.Latitude.ToString(); 

   txtLongitude.Text = "Longitude: " + geoposition.Coordinate.Longitude.ToString(); 

  catch (Exception) 
    txtStatus.Text = "Your phone may not have geolocation API support."; 

This method first check weather user allowed to access location or not by accessing the value of key ‘LocationPermission’ from Application Settings. If user not allowed then we will simply return.(You can show message to user here. E.g. You have rejected permission to access location.)

If user allows, we will create object of Geolocator. Set property ‘DesiredAccuracyInMeters’ to 50 meters. This option defines the accuracy of the location. You can get object of Geopostion by using the GetGeopositionAsync method of Geolocator object. Geoposition object contain Coordinate property which have Latitude and Longitude values. Set this values to the label as text.

Here is the final screen where you will see the Latitude and Longitude values on screen.



In this post we have seen the following things

  • How to add location API capability in the manifest file.
  • Ask user to allow to access location.
  • Save user response in application settings.

In the next post we will see how can we use this coordinates to show location on maps.

Enrich user interface of your web application with Bootstrap UI framework

Bootstrap is very reach UI framework, flexible and responsive. It is made by Twitter and hosted on github.

You can find the more details at

Let’s start to integrate this framework into your web application.

Very first you need to download framework files from bootstrap website mentioned above. Download will contain ZIP file (bootstrap-x.x.x-dist.ZIP)

After extracting the downloaded ZIP file, you will get three folders:

  • css: This folder contains style sheets files for the bootstrap framework and theme
  • fonts: This folder contains necessary files for the fonts
  • js: This folder contains JavaScript files for bootstrap framework.

For the further process I have used Visual Studio to create and manage web application. You can use any editor instead of the Visual Studio.

In the Visual Studio go to the menu:  File -> New -> Project. It opens New Project dialog. Select ASP.NET Web Application and give the name for the solution.

Enrich user interface of your web application with Bootstrap UI frameworkClick on OK then Select Empty project type.

select empty project template

Click OK to create project.

You will see solution created as below.


Right click on ‘WebAppWithBootstrap’ the solution select Add then select HTML Page.

Solution2Give the name as index.html


Index.html file is created opened in editor.

Now add folder ‘Bootstrap’ by right-click on solution and choose Add and then New Folder.


Then create two folder called ‘css’ and ‘js’ inside the folder ‘Bootstrap’


Now copy the ‘bootstrap.min.css’ file from css file folder of the extracted Bootstrap zip file to the css folder of the solution. Also copy the ‘bootstrap.min.js’ JavaScript file from js folder of the extracted Bootstrap zip file to the js folder of the solution.


Now we need to give references of the added css and js file into index.html file as follows.


Here we have added meta tag with viewport and set content width=device-width. This made your page responsive.

We have done with the integration of Bootstrap framework with web application.

Now open the page into browser.


jQuery Mobile Introduction

Touch-Optimized Web Framework for Smartphones & Tablets

Recently I worked on mobile application based on HTML5 and JQuery. I have used jQuery mobile framework. It is very simple to learn and use, if you already know jQuery. You can find out more stuff from below site.

You can view documentation from below site. This site optimized to open in all mobile browsers.

You can download necessary files to use jQuery mobile from below site.

jQuery mobile also provide CDN-hosted versions. These are minified and compressed with host images.

You need to copy and paste following lines into your project to use jQuery mobile framework.

<link rel="stylesheet" href="" />
<script src=""></script>
<script src=""></script>

jQuery mobile supports theme based UI. This framework also provides default themes. You can create your own custom theme by theme roller.