Skip to main content

Windows 8 RTM Using bing map control. How to use the map control in a metro (modern) style App



This is a briefing article on how to start using Bing map control using XAML & C#, to begin with you must first follow a set of instruction to get a license key for using Bing maps.
Lets talk first about bing maps and the map control

Bing map control is a part of the Bing SDK for windows 8 modern style apps

About the SDK as Microsoft says :
Bing Maps SDK for Metro style apps (RTM Beta) combines the power of Windows 8 and Bing Maps™ to provide an enhanced mapping experience for modern style apps. Developers can use this Bing Maps control to incorporate the latest road maps and aerial views into a Windows 8 Metro style app. This SDK includes controls for apps built using JavaScript, as well as apps built using C#, C++, and Visual Basic, and requires a Bing Maps Key for a Windows Metro style app. (If you have an existing “Metro style apps (BETA)” key, it will still work until the evaluation period expires.)

Now lets get started and here is the prerequisites that you need to have to check out this tutorial. You will need to have Windows 8 and visual studio 2012 installed.

lets get the SDK
Here is the link for the latest bind sdk

In order to use the SDK you must obtain a development key
So to obtain the developer key you need to setup an account on this website https://www.bingmapsportal.com/
Register and get the key and u r up and running now lets start the coding

Get started with the code
Open Visual studio and click new project and set it to windows app and then click ok

In order to add the map control we need to add certain reference

Right click on the project and click add reference then choose extensions tab and choose the Bing maps and 
Microsoft runtime check the image below

Now If you build an error will occur that error occurs because the default build action is any cpu  unfortunately the map control and the Bing SDK does not have the value so if you set it to 86x or 64x it will be fine, to do that click on build and then build configuration and choose the cpu

Open the main page from the solution explorer
We need to save the key, I am a fan of using the XAML Recourses to hold strings like that so I am gonna use It as below in the page resources
  <Page.Resources>  
     <ResourceDictionary>  
       <ResourceDictionary.MergedDictionaries>  
         <ResourceDictionary Source="Common/StandardStyles.xaml"/>  
       </ResourceDictionary.MergedDictionaries>  
       <x:String x:Key="BingMapsApiKey">AjmHAaDn2wRb336KlkksJ63ybHkThkl0_too3f-sfxm3zMosuPNJ6WkPuvhZ6oNu</x:String>  
     </ResourceDictionary>  
   </Page.Resources>  


I have experienced this many times but it seem you have to restart the project to see map control so I would restart the visual studio if the following procedures did not pass
Lets and alias to the Bing dll and to use it in the page

 <Page  
   x:Class="TyingBing.MainPage"  
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
   xmlns:local="using:TyingBing"  
   xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
   xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
   xmlns:bm="using:Bing.Maps"  
   mc:Ignorable="d">  
Add the Bing map control in our page check the code below “now that I use the static resource as the credentials property value”
 <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">  
     <bm:Map x:Name="MyMap" Width="640" Height="480"   
        Credentials="{StaticResource BingMapsApiKey}" />  
   </Grid>  
Now hit F5 and then watch the map working……… have fun

There shall be another posting containing how how to add push pin and multiple push pins
Thanks for reading 


Comments

  1. If you are looking for a solid contextual ad company, I recommend that you check out Chitika.

    ReplyDelete
  2. If you need your ex-girlfriend or ex-boyfriend to come crawling back to you on their knees (no matter why you broke up) you need to watch this video
    right away...

    (VIDEO) Text Your Ex Back?

    ReplyDelete

Post a Comment

Popular posts from this blog

(AsyncWebClient) Async Webclient for windows phone 8

Using windows phone web client is pretty common but the thing is you can not use it using Async -> Await mechanism so i used threading to create an async functionality for The Download string and upload string methods here is the code below // Comment public class AsyncWebClient { public Task DownloadString(Uri uri) { var task = new TaskCompletionSource(); try { var client = new WebClient(); client.DownloadStringCompleted += (s, e) => { task.SetResult(e.Result); }; client.DownloadStringAsync(uri); } catch (Exception ex) { task.SetException(ex); } return task.Task; } public Task UploadString(Uri uri, string content) { var task = new TaskCompletionSource(); try { var client…

RuntimeBinderException cannot resolver property in Unit Test in case of dynamic return.. Solved

Xamarin UI Tests – Deep dive Part 1

IntroAs the title may describe this is the first of the series of articles that will cover the UI Test of Xamarin in a deep dive, we will start simple and then dig deeper as we go. Since this is very well the first of the series, it will mostly cover up the architecture and the testing technique that Xamarin UI Tests uses.

The Technology
Xamarin UI Test is an automation testing framework similar to selenium, Watir, Watin (.net), Robot and Sikuli, if you have used BDD (Behavioral Driven Development) or a more advanced TDD (Test Driven Development) approach at least you must have come across one of these frameworks, and in that perspective comes Xamarin UI Testing as an automation framework designed specifically for Xamarin Automation testing, For starter Xamarin UI Tests was not build from scratch, instead it was built on top of another UI Automation testing framework that is targeting android and iOS sepecifically which is Calabash, I have to say that this choice was made wisely as of n…