Appsmash https://docs.microsoft.com/archive/blogs/matthiasshapiro/feed.xml Windows Phone Apps from Concept To Reality Wed, 17 Apr 2019 03:23:31 GMT en-US hourly 1 Using Offline Maps in Windows Phone 8 https://docs.microsoft.com/archive/blogs/matthiasshapiro/using-offline-maps-in-windows-phone-8 Fri, 14 Jun 2013 01:29:00 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/06/14/using-offline-maps-in-windows-phone-8/ This is a support post for the Inside Windows Phone show on location and mapping in Windows Phone 8 published here.

I love the offline maps feature in Windows Phone. I love to travel and I frequently find myself in need to maps even when I don’t have good connectivity on my device (especially in other countries).

The great news for developers is that when the users have downloaded maps for offline use, we get a huge number of benefits. We can get addresses offline using reverse geocoding, we can map directions for walking or driving, we can know that our mapping is still strong despite a lack of connectivity.

Of course, we get all that for free only if the user downloads the maps for offline use. But driving them to this is fairly easy to do. All it takes is:

MapDownloaderTask mdt = new MapDownloaderTask();
mdt.Show();

And this pushes us into the native UI for downloading the maps. If we wanted to guild the user a little more clearly, we could perform a reverse geocode on their location and then give them guidance to what map we need them to download.

]]> Finding and Mapping a Route in Windows Phone 8 https://docs.microsoft.com/archive/blogs/matthiasshapiro/finding-and-mapping-a-route-in-windows-phone-8 Fri, 14 Jun 2013 00:46:00 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/06/14/finding-and-mapping-a-route-in-windows-phone-8/ This is a support post for the Inside Windows Phone show on location and mapping in Windows Phone 8 published here.

One of the really cool and powerful things in the Windows Phone mapping services is the ability to simple hand the Windows Phone APIs a list of geo coordinates and have it create walking or driving route on the fly. Because of the power of offline mapping in Windows Phone 8, this means that developers can create extremely powerful directional software that works even when the phone doesn’t have network connectivity.

The first thing we need to do is set up a map control on which to display our resulting route.

In XAML:

<maps:Map x:Name="myMap" />

Then we’ll set up a list of geocoordinates representing the order of the places we want to use to establish our route and add some locations to it. 

List<GeoCoordinate> wayPoints = new List<GeoCoordinate>();
wayPoints.Add(new GeoCoordinate(47.60887, -122.34094));
wayPoints.Add(new GeoCoordinate(47.6396, -122.1300));

Then set up our RouteQuery object, assign an event handler so we can read the result, choose between a route for walking or driving and then assign the list of geo coordinates and we’re off!

RouteQuery routeQuery = new RouteQuery();
routeQuery.QueryCompleted += routeQuery_QueryCompleted;
routeQuery.TravelMode = TravelMode.Walking;                    
routeQuery.Waypoints = wayPoints;
routeQuery.QueryAsync();

The RouteQuery will work for a little while and then return with (what is hopefully) a suitable route made of 

void routeQuery_QueryCompleted(object sender, QueryCompletedEventArgs<Route> e)
{
    if (null == e.Error)
    {
        Route MyRoute = e.Result;
    }
}

The result will be a Route object that gives an estimated duration for travelling the route as well as an enormous amount of detailed data about how to get from point A to point B (and then, subsequently, points C, D, and E). The instructions between each point are kept in the Legs property of the Route and each leg has every street and every turn detailed in the Maneuvers property. It’s really easy to work with.

But even better than that is the fact adding the route to your map is only 1 line of code (but I like to use 3 to make things easier):

Route MyRoute = e.Result;
MapRoute mappedRoute = new MapRoute(MyRoute);
scavangeMap.AddRoute(mappedRoute);
scavangeMap.SetView(mappedRoute.Route.BoundingBox);

What I’ve done here is add the UI to represent this route to my map and then moved and scaled the map so that it is in the perfect spot for the user to start interacting with the route.

]]> Reverse Geocoding in Windows Phone 8 https://docs.microsoft.com/archive/blogs/matthiasshapiro/reverse-geocoding-in-windows-phone-8 Fri, 14 Jun 2013 00:14:00 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/06/14/reverse-geocoding-in-windows-phone-8/ This is a support post for the Inside Windows Phone show on location and mapping in Windows Phone 8 published here.

Reverse geocoding is the process of getting an address from a latitude/longitude pair. With Windows Phone, this process is not only easy, it works in conjunction with the offline mapping capability so that developers can query addresses from a geocoordinate even when there is no data signal available.

The process is extremely straightforward: Add the namespace

using Microsoft.Phone.Maps.Services;

And create a new ReverseGeocodeQuery, give it a valid GeoCoordinate and set up the an event handler to manage the result.

ReverseGeocodeQuery reverseGeocode = new ReverseGeocodeQuery();
reverseGeocode.GeoCoordinate = new GeoCoordinate(47.60887, -122.34094);
reverseGeocode.QueryCompleted += reverseGeocode_QueryCompleted;
reverseGeocode.QueryAsync();

Then in our event handler we will get a result (or list of possible results) back as a MapAddress object.

void reverseGeocode_QueryCompleted(object sender, QueryCompletedEventArgs<IList<MapLocation>> e)
{
    MapAddress geoAddress = e.Result[0].Information.Address;           
}

This object will contain a nice helpful set of properties that we can then use to construct a valid address.

image 

]]> Calculating Distance From 2 GeoCoordinates in Windows Phone 8 https://docs.microsoft.com/archive/blogs/matthiasshapiro/calculating-distance-from-2-geocoordinates-in-windows-phone-8 Thu, 13 Jun 2013 23:45:00 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/06/13/calculating-distance-from-2-geocoordinates-in-windows-phone-8/ This is a support post for the Inside Windows Phone show on location and mapping in Windows Phone 8 published here.

Calculating the distance between two GeoCoordinates in Windows Phone 8 is about as simple as it can get. First, get a GeoCoordinate. One handy way of doing this is to get the location of a tap on the Map control.

Set up the tap event hander on your Map:

<maps:Map x:Name="myMap" Tap="ReadMapTap" />

And then translate the tap location into a GeoCoordinate like so:

void ReadMapTap(object sender, System.Windows.Input.GestureEventArgs e)
{
    GeoCoordinate tapLocation = 
         distanceMap.ConvertViewportPointToGeoCoordinate(e.GetPosition((UIElement)sender));
}

Then we just create another GeoCoordinate, like maybe Microsoft campus:

GeoCoordinate Msft = new GeoCoordinate(47.6396, -122.1300);

And just ask one of our GeoCoordinates how far it is to the other one. 

double distanceToMSFT = tapLocation.GetDistanceTo(Msft);
MessageBox.Show("It is " + distanceToMSFT.ToString() + " meters from there to Microsoft!");

The result will be in meters and is based on the haversine formula for calculating distance over the surface of the earth (my favorite!)

]]> 10 Great Windows Phone 8 Code Samples (No, Wait… 30) https://docs.microsoft.com/archive/blogs/matthiasshapiro/10-great-windows-phone-8-code-samples-no-wait-30 Thu, 21 Mar 2013 13:18:00 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/03/21/10-great-windows-phone-8-code-samples-no-wait-30/ Sometimes we don’t want to read a blog posts on a topic, we want to look at the code implementing it. Working code cuts through the confusion and explanations and gets us to the heart of the things we want to do. That’s why we should be familiar with the wealth of samples available for Windows Phone on MSDN.

There are a lot of very cool samples on MSDN covering a lot of topics. As I went through them I was so inspired, I thought a visual of the samples would be a great way to help navigate them. So I selected 30 of my favorite sample and put together this chart showing how the samples walk through different Windows Phone 8 features and technologies.

image

(click for interactive version)

This isn’t to say there are only 30 good samples on MSDN. But I had to make a cut-off somewhere before I ended up with more information than I could reasonable show on a screen.

You can also download a larger static version of this graph here

I also wanted to highlight 10 of my favorite samples from that chart.

10) URI Association and NFC 

wp_ss_20130320_0007     wp_ss_20130320_0005

In Windows Phone 8 there are so many opportunities for our apps to connect outside of the sandbox. This sample looks at one of the ways we can launch our apps: URI Associations. We just register our app to handle the appropriate association and when the user hits a link with that association, it launches our app. Unless, of course, our app isn’t installed. If that’s the case, it goes to find out app.

This sample includes 3 projects so we can see all the options available with URI associations including simple app launching, selecting multiple apps from a list and NFC app launching.

9) LongListSelector PhotoHub

image     image

LongListSelector is a new control in Windows Phone 8 and the preferred control for showing big lists. But using it appropriately requires a little bit of practice and maybe a good sample or two. This sample shows how to use the LongListSelector with a large sorted group or photos. It includes an example of styling and templating with JumpListStyle, and GroupHeaderTemplate. Be sure to check out the companion sample LongListSelector PeopleHub.

8) LongListSelector Infininte Scrolling (With Twitter) 

wp_ss_20130320_0004

Another LongListSelector sample, but this really is an important concept in Windows Phone 8. What I love about this one is that it deals with a common scenario: Load a pile of data, let the user scroll and load more when they hit the bottom of the current list. In addition to that, it is a scrolling list with images, so we can see the preferred way to do background image loading for a really rich, smooth experience.

7) Visual Studio 3D Starter Kit

image

With Windows Phone 8, we support native code with an eye toward creating the most compelling gaming experiences on any mobile platform. This project is a great sampler of implemented features. Loading and rendering assets, animated meshes, 2D XAML HUD, shaders and some game logic make this a great intro to making games for Windows Phone8. As a bonus, it also can serve as a starting point for creating a Direct3D game with shared code between Windows Store (Windows 8) and Windows Phone 8 games.

6) Speech Recognition Using a Custom Grammar

wp_ss_20130321_00021     wp_ss_20130321_00031

Easy Speech recognition and synthesis APIs in Windows Phone 8 make speech one of my favorite new features. But the first question is always “Does speech recognition work when the phone is offline?” to which my answer is “Windows Phone speech is as functional offline as Siri is when on your phone is online." (Get it! It’s OK to laugh.) But that’s not actually very fair because Windows Phone speech is still pretty useful offline due to the ability to implement custom grammars that let the phone recognize a defined vocabulary of words.

This sample shows how to create a custom grammar and do speech recognition while suppressing the default speech recognition UI. It’s a powerful example.

5) Wallet membership and deals 

image     image

The Wallet APIs in Windows Phone are a really powerful way to connect your app to the user’s Wallet experience. This sample shows how to manage a custom membership card, connect it to the Wallet, and let the user select coupons to add to their Wallet. It’s a great demo for a feature that doesn’t get nearly the attention it deserves.

4) Windows Phone 8 Networking Samples

image     image

This is a wide ranging sample covering socket connections, NFC tag writing, NFC device-to-device connections, data downloads, and (most importantly) Bluetooth connections to the Lego Mindstorms NXTCar.

3) Chatterbox VoIP Sample App

image     wp_ss_20130321_0002

Under “little-known-features” a lot of people don’t know that Windows Phone 8 not only supports VoIP calls from your app using native APIs but offers to developers the use of default UI paradigms for making and receiving calls. Add to this the ability to run these calls in the background (just like any phone call) and it’s a powerful addition to our development toolbox. This sample goes through

2) Basic Lens App

wp_ss_20130321_0005     wp_ss_20130321_0004

Creating a Lens application means being part of an exclusive club of apps that do awesome things with the camera. By integrating our app with the default camera app through the Lens feature, our apps can become true extensions of the platform. This sample not only gives a complete implementation of Lens integration, but a complete implementation of a full-featured photo app. It has transition animations, UI for user focus, camera hardware button functionality, and PhotoHub integration. It’s a really powerful sample and a great place to start if you’re building a photo app for Windows Phone.

1) Photo Extensibility

wp_ss_20130321_0008     wp_ss_20130321_0009

Some of the samples have names that don’t really give a good idea of how awesome they are. Photo Extensibility is one of those samples. The truth is that extensibility is one of the most powerful developer features of Windows Phone 8 and this sample shows that power. It shows how to launch your pictures app from pretty much anywhere. Launch your app from the PhotoHub, using the share or edit or apps options on every photo, and how to add “captured by [your app name here]” rich media link on photos captured using your app. By implementing these extensions on your photo app you can make your app the center of they user’s mobile photo experience, which is a pretty exciting proposition.

]]> Missing OpenStreamForWriteAsync on my StorageFile https://docs.microsoft.com/archive/blogs/matthiasshapiro/missing-openstreamforwriteasync-on-my-storagefile Tue, 12 Mar 2013 15:09:33 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/03/12/missing-openstreamforwriteasync-on-my-storagefile/ I have a sample that I use when serializing data in order to save it to a StorageFile in Windows 8 and Windows Phone 8. It looks a little something (or exactly) like this:

StorageFile kittenFile = await ApplicationData.Current.LocalFolder.CreateFileAsync("Kittens4Ever.kittens", CreationCollisionOption.ReplaceExisting);

var writeStream = await kittenFile.OpenStreamForWriteAsync();
DataContractSerializer kittenSerial = new DataContractSerializer(typeof(ObservableCollection<Kitten>));
kittenSerial.WriteObject(writeStream, listOfKittens);
                        
await writeStream.FlushAsync();
writeStream.Close();

But I keep running into this problem where my StorageFile doesn’t have the OpenStreamForWriteAsync method available. After yelling and cursing and bing-ing the problem for a while, I realize the solution:

 

OpenStreamForWriterAsync (and OpenStreaForReadAsync) are extension methods that require System.IO to be added as a reference. So I just add it

using System.IO;

and everything works fine.

]]> Getting Started With Windows Phone 8 HTML5 Apps https://docs.microsoft.com/archive/blogs/matthiasshapiro/getting-started-with-windows-phone-8-html5-apps Fri, 15 Feb 2013 11:35:56 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/02/15/getting-started-with-windows-phone-8-html5-apps/ Windows Phone 8 SDK. You can also download the project with all these examples imeplemented. First of all, one thing I found was that I need to turn on IsScriptEnabled in the WebBrowser control in our MainPage.xaml. 
<phone:WebBrowser x:Name="Browser" IsScriptEnabled="True" />
The template does this, but in the code behind and only after loading the content. We want to run all the Javascript right off the bat so we IsScriptEnabled to be turned on.

Turn Scrolling On or Off

Now we need to decide if we want our HTML app to scroll. In many cases (creating simple HTML content apps) it makes sense to have the app scroll. If this is your scenario, you're in luck... you have to do nothing. But in many other cases you might want to turn off scrolling. If you're creating a game or you want your user to be able to use touch events in a very rich way. In this scenario, you can either turn off scrolling the hard way (also known as the Windows Phone 7 compatible way) or the easy way, which is to go into your phone.css and add: 
body { -ms-touch-action:none; }
That takes care of some of our initial setup. Now let’s run some Javascript. We can run Javascript a couple ways.

Javascript: TheTraditional Way

This way we focus entirely on HTML/JS. So if we give our page title an id: 
<p id="dynamicTitle">page title</p>
and then we add a script to change that title 
<script type="text/javascript"> 
 document.getElementById('dynamicTitle').innerHTML = "running javascript"; 
</script>
we’ll see that text updated at runtime. Super easy.

Run Javascript Function From C#

We can also add a function to our HTML or Javascript files, but leave it up to our C# file to run that script. In this case we would add a function like so: 
<script type="text/javascript">
 function changeTitle() { 
 document.getElementById('dynamicTitle').innerHTML = "function initiated in C#"; 
 }

 function changeTitle(someNewText) { 
 document.getElementById('dynamicTitle').innerHTML = someNewText; 
 } 
</script>
And then call that function from our C# using our WebBrowser control. 
Browser.InvokeScript("changeTitle");
If our function has parameters, we can add those parameters using InvokeScript 
Browser.InvokeScript("changeTitle", new string[]{"change using parameter"});

Add Javascript Using C#

The last way to run Javascript is to just inject it into the page. In this case, we could just update our app using: 
Browser.InvokeScript("eval", 
 new string[] { "document.getElementById('dynamicTitle').innerHTML = 'injected javascript';" });
When the question is “which method do I use to run my Javascript” the only real answer is “whichever one fits your scenario”. If you’re writing an app using mostly HTML/JS and just relying on the WebBrowser to act as a container, I’d lean as much as possible on running Javascript in my HTML/JS files. However if you’re using the WebBrowser in a mixed-code application using C# to do some things and HTML/JS to do others, it might make sense to add some functions as entry-points so we can launch Javascript functions based off of events in the C#.

Talk To the App (C#) From the Browser

Of course, if we’re communicating to the browser from C#, we might want to talk to C# from the browser as well. If you want to send information to C# from the browser, just run the following Javascript code: 
window.external.notify("This is a notification from HTML");
and the browser will launch an event called ScriptNotify. We can tell our app to handle that script launch either in the XAML of our WebBrowser: 
<phone:WebBrowser x:Name="Browser" 
 ScriptNotify="HTML_Script_Launched" />
Or by assigning it in the xaml.cs file 
Browser.ScriptNotify += HTML_Script_Launched;
then we can read out the notification in our event handler. The example below just takes whatever notification we sent and puts it into a MessageBox. 
private void HTML_Script_Launched(object sender, NotifyEventArgs e) 
{ 
 MessageBox.Show(e.Value); 
}
We can use this to interact with app-specific functionality like launchers and choosers or launching a MessageBox or perhaps communicating with the app bar.]]> Weekly Links – 2-11-2012 https://docs.microsoft.com/archive/blogs/matthiasshapiro/weekly-links-2-11-2012 Mon, 11 Feb 2013 08:47:40 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/02/11/weekly-links-2-11-2012/ Due to travel and other engagements, I’ve missed a couple of weekly links, so this one will be slightly larger.

One thing I want to call out specifically is that Ben Riga and I have been working on a set of sessions on building for both Windows 8 and Windows Phone 8. Ben will be presenting these sessions for Microsoft Virtual Academy on February 21st. I would be joining him except that I’m heading to Barcelona for Mobile World Congress that day. Nevertheless, it is a great set of lessons for building apps across Windows-based devices.

Windows Phone 8

Windows Phone 8 HTML/JS

Windows 8

Design and UX

  • Color Scheme Creator – a simple Windows 8 app for constructing a color scheme based on a photograph
  • PlaceCage – a set of flexible image placeholders featuring Nic Cage
  • 366 Logos – A logo a day every day of 2012. Each logo created in about an hour.

Other Awesome Things

]]> Using an AdControl in a Trial App (Windows Phone) https://docs.microsoft.com/archive/blogs/matthiasshapiro/using-an-adcontrol-in-a-trial-app-windows-phone Sun, 27 Jan 2013 02:38:43 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/01/27/using-an-adcontrol-in-a-trial-app-windows-phone/ I had to search around for this information so I thought it would be nice to have it somewhere handy. Here’s the scenario: You want to put ads into your Windows Phone app, but only when it is in trial mode.

To start:

  • Download the Microsoft Ads SDK
  • Sign into the Microsoft pubCenter and add an ad and an application to your account. You will get an ad id and an application id that we’ll use below to display the ads.

Add structure for your AdControl

I decided that the best way to do this was to create a Grid layout with 2 rows. The top row is for all the important stuff in my app and the bottom row is holding my AdControl. The XAML looks something like this:

<Grid x:Name="LayoutRoot" >
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid x:Name="MyContent">
        <!-- all my UI goes here -->
    </Grid>
    <Border x:Name="AdControlHolder" Grid.Row="1">
    </Border>
</Grid>

Add logic to include the AdControl if we are in trial mode

If I don’t place anything in my Border control, it will be completely invisible. So what we’re going to do is:

  1. Check to see if our app is in a trial mode
  2. If it is, add the AdControl. Otherwise do nothing.

The only problem with this is that it can be difficult to test. For one thing, the AdControl requires some custom parameters to run in a test environment. Additionally, we can’t set the app to “trial mode” in the test environment, so we have to simulate it. I’ve tried to take all this and encapsulate it in a block of code.

LicenseInformation info = new LicenseInformation();
#if DEBUG
if (true) 
#else
if ( info.IsTrial() ) 
#endif                
{    
    // running in trial mode
    AdControl ac = new AdControl();
#if DEBUG
    ac.AdUnitId = "Image480_80";
    // or for text ads
    //ac.AdUnitId = "TextAd";
    // or for smaller ads
    //ac.AdUnitId = "Image300_50";
    ac.ApplicationId = "test_client";
#else
    ac.AdUnitId = "000000"; // insert your AdUnitId from the pubCenter site
    
    
    // add your ApplicationId from the pubCenter
    ac.ApplicationId = "12345678-1234-1234-1234-123456789012";
 #endif
    ac.Width = 480;
    ac.Height = 80;
    AdControlHolder.Child = ac;
}

And that should be good to get started!

]]> Weekly Links, January 15 2013 https://docs.microsoft.com/archive/blogs/matthiasshapiro/weekly-links-january-15-2013 Tue, 15 Jan 2013 11:04:36 GMT https://blogs.msdn.microsoft.com/matthiasshapiro/2013/01/15/weekly-links-january-15-2013/ Windows Phone

Windows 8

Design, HTML5, and Other

]]>