Appsmash

10 Great Windows Phone 8 Code Samples (No, Wait… 30)

2013-03-21T20:18:00Z

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.

(click to enlarge)

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.

For an interactive version of this visual, I built a little Silverlight app

Interactive Windows Phone 8 Samples Browser

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

10) URI Association and NFC

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

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)

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

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

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

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

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

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

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

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

2013-03-12T22:09:33Z

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

2013-02-15T19:35:56Z

I’ve recently been learning to write HTML 5 / Javascript apps for Windows 8 and wanted to take some of that knowledge and transfer it over to Windows Phone 8. As I did so, I learned there are a lot of little “tweaks” that I needed to do to get things working so I thought I’d share those in a post. If you’d like to follow along, I’m basically just tweaking and adding bits and pieces to the default HTML project available when you’ve installed the 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

2013-02-11T16:47:40Z

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

Spotify is available for Windows Phone 8!
Running the Windows Phone 8 emulator on a Mac OS
Windows Phone 8 SDK on a Virtual Machine with a Working Emulator
Using the Share Link task for Windows Phone – takes in a link and shares it with any of the social networks already integrated into the device
How to connect to a local web services using with Windows Phone 8 emulator (hint: boundary machine)
Windows Phone API Quickstart – a nice big visual summary of the Windows Phone APIs
Coding4Fun Toolkit (Clint Rutkas) – An incredibly valuable toolkit for Windows Phone / Windows 8 development. Includes GzipWebclient, Audio Recorder, storage wrappers, additional controls. Really cool.
Proximity Tapper – NFC emulation for the Windows Phone emulator.
NFC Toolkit beta testing – from @MSicc, a beta app for NFC tag reading, writing and profiles
Windows Phone app for desktop (Preview 3) – The missing link between your Windows Phone 8 phone and your media libraries
Auto-launching apps using file and URI associations for Windows Phone 8 – an underappreciated feature, but one that I’ve implemented to great effect
Wallet and In-App Purchase for Windows Phone 8 ( Mustafa Kasap) – HUGE post on integrating Wallet features and functionality and in-app purchases into your Windows Phone app
Using an Ad Control in a Trial App (With Debugging Support)
All the MSDN Code Gallery samples for Windows Phone 8 (about 90 items)
Super NES emulator app for Windows Phone 8
3D Print your own Lumia 820 cover using the official specs from Nokia
Adding Network Connection Settings to your Windows Phone app (Airplane Mode, Bluetooth, Cell, Wifi)
Basic Speech Synthesis in Windows Phone 8 (code)
Basic Speech Recognition in Windows Phone 8 (code)

Windows Phone 8 HTML/JS

Build a Hybrid App for Windows Phone 8 using appMobi (Dave Isbitski @thedavedev) – Starting to see Windows Phone 8 support in a lot of the HTML5-based cross-platform tools.
YoYo Games GameMaker Studio – for cross-platform game development, supports Windows Phone 8 as well as Windows 8. (And also, iOS, Android and Mac OS, but no one cares about those, right?)

Windows 8

Adding a ListView to Display a List of Items in Windows 8 (HTML/JS) And then adding a template and functionality to those listview items
Making $30K a month on Windows 8 apps – It can be done.
Fall Fury: Part 2 – Shaders – Some of the geniuses at Channel 9 are outlining how they built the Fall Fury game
HTML5 game Mudvark hitting hundreds of thousands of downloads on Windows 8
Reading and Writing Text Files in Windows 8 Metro Store Apps (Morten Nielsen @dotMorten) – Same code also works in Windows Phone 8
How do I port my iOS or Android app to Windows 8 (Windows Store)? (videos)
A stupid huge list of tips for using/configuring 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

Kinect Magic Mirror demo code (goes along with Rob Relyea’s Kinect for Windows Programming Deep Drive Build talk)
Why We Shut Down Charm on the Even of Public Launch (Amy Hoy @amyhoy) – balancing the success of a product against the scalability of that product and making the hard decisions that are right for the customers. Ouch.
Building a Great Web API (Evan Cooke or Twilio) – includes the valuable line “It should take no more than 5 minutes for a developer to perform a useful task using your API for the first time."
RunPee – Ever need to hit the restroom during the movie but worried you’ll miss something? RunPee tells you the slowest point in the movie and lets you know what you’ll miss while you go.
Why JavaScript kind of drives me crazy sometimes
Your Conference Presentation (from PhD Comics)
Bluetooth gloves that work as a head-set for your phone

Using an AdControl in a Trial App (Windows Phone)

2013-01-27T10:38:43Z

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:

Check to see if our app is in a trial mode
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

2013-01-15T19:04:36Z

Windows Phone

Limiting TextBox Input To Integers in Windows Phone – Simple enough, but I use it every couple of projects so I thought it should go somewhere I can find it.
Add Windows Phone 8 Builds to your Existing Apps (Rajen Kishna @rajen_k) – If you want to support both Windows Phone 8 and Windows Phone 7 AND you want to feature some Windows Phone 8 only features, you’ll need this post.
Background Agents for Windows Phone (Part 1 of 3) (Peter Torr) – I was working on some periodic task project this last week and Peter’s post was invaluable.
Windows Phone 8 Camp in Amsterdam – I’ll be speaking at the Windows Phone 8 Camp in the Netherlands this coming Wednesday (January 23). Hope to see you there!
Windows Phone 8 skins for your emulator (Lee Stott @lee_stott) – Will installing a custom skin on your Windows Phone 8 emulator make you a better Windows Phone developer? Yes. And I judge you accordingly.
PhoneGap 2.3.0 is out! – PhoneGap (now has support for Windows Phone 8)

Windows 8

MSDN TechTalk Event: Windows Store apps and games using HTML5, Javascript and CSS (starring Jeff Burtoft @boyofgreen) – Jeff Burtoft is speaking in Zurich on Windows 8 development in HTML5. You couldn’t ask for a better HTML5 speaker, his knowledge is encyclopedic.

Design, HTML5, and Other

Construct2 – HTML5 game engine. I’m totally going to get into this… some day…
Perihelion font for $30 – a pretty cool font
PlaceKitten.com – For when you need a kitten placeholder service for your designs
EEG readings + data crunching = Phenotype patterns in psychotic diagnoses (John Robert Shapiro) – Yeah, I have weird leisure reading (inspired by my neuroscientist brother), but it’s actually some pretty cool EEG research looking at auditory responses characteristic in psychotic diagnoses (could lead to identifying genetic markers for these conditions).

Windows Phone ScheduledTask Agents and FileNotFoundException

2013-01-11T22:29:05Z

Maybe this is a problem that I’m all alone on, but it took me some time to figure out.

I started up a ScheduledAgent for Windows Phone so that I could do some updates with a PeriodicTask, but when I ran the app, I was getting:

FileNotFoundException was unhandled – An unhandled exception of type ‘System.UI.FileNotFoundException’ occurred in System.Windows.ni.dll

Here’s what happened:

I had initially named my ScheduledTask project something stupid, so I needed to re-name it. I did so by clicking on the project name and renaming it.

If I had opened the properties section of the project

I would have seen that my assembly name (which names the actual file we’re looking for) was still the old stupid name

Once I update this name, I need to go to my WMAppManifest.xml file in my startup project and open it with the text editor.

<ExtendedTask Name="BackgroundTask">
  <BackgroundServiceAgent
    Specifier="ScheduledTaskAgent"
    Name="MyAwesomeTask"
    Source="MyScheduledTask"
    Type="MyScheduledTask.ScheduledAgent" />
</ExtendedTask>

It took me some time to figure out what the parameters in the BackgroundServiceAgent meant so:

Specifier – ScheduledTaskAgent

Name – the string name you give your task when you start it. In the example below, it would be Name=MyAwesomeTask:

PeriodicTask myPeriodicTask = new PeriodicTask("MyAwesomeTask");
ScheduledActionService.Add(myPeriodicTask);

Source – the name of the DLL that holds your task code. This is determined in the Assembly name box you see in the properties section of your csproj.

Type – the namespace.type notation that points to the actual object (which must inherit from ScheduledTaskAgent)

Weekly Links - January 7 2013

2013-01-07T20:13:42Z

Windows Phone

Mark Cuban has a Nokia Lumia Windows Phone – and discusses this fact in standard Mark Cuban style, of course.
Where to buy NFC tags and how to edit them (Adam Fraser) – Some great pointers to getting good NFC tags for sample development
Registering Extensions in Windows Phone – There are a lot of ways to get your app to integrate with other parts of the device in Windows Phone. Usually, this involves registering an extension (so the device knows to integrate your app appropriately). Here’s a step-by-step guide to doing so.
Adding a Flip Tile (FlipTileData) in Windows Phone 8 (Matthias Shapiro)
Windows Phone 8 & 7.x Design Cheat Sheet (Nathalie Belval @nbelval) – A wonderful poster/card summarizing much of the important info for Windows Phone icons, colors, and screens.
Get the GeoCoordinate of a Tap on the Map Control in Windows Phone 8
Proximity Tapper NFC sample for Windows Phone 8 & Windows 8
Adding Tilt in Windows Phone

Windows 8

Using Windows 8 Metro icons from the font file (Jonathan Antione) - Using the font “Segoe UI Symbol”, we can add Windows 8 icons to our apps. This also works in Windows Phone 8.
Windows Store Icon Maker – create icons for Windows Store and Windows Phone 8 quickly and easily

Design, Usability and Stuff

Windows 8 App Design Sheet (Jeremy Foster @codefoster) – I much prefer starting my app brainstorms with a pencil and a design sheet rather than staring at a blank screen.
8 Reasons C# is the Best Language For Mobile Development
Chuck Close on Creativity, Work Ethic, and Problem-Solving vs. Problem Creating – “Inspiration is for amateurs - the rest of us just show up and get to work. And the belief that things will grow out of the activity itself and that you will - through work - bump into other possibilities and kick open other doors that you would never have dreamt of…”
PBS short on Processing and Creative Coding (6 minute video)
1000 Gaming Icons – just because
Dynamic Visuals: Motion, Tweening, and Easing - I love motion in UIs and @rainypixels recommended this very highly
Facebook as a clean Modern UI style – I always love these theoretical design excursions
Lego Mindstorms EV3 – the next generation of Mindstorms. I’m pretty excited.

Windows Phone 8 & 7.x Design Cheat Sheet

2013-01-03T18:30:08Z

I tweeted this, but it is so fantastic it needed its own blog post.

Nathalie BELVAL (@nbelval) put together this handy card for designing and developing apps for Windows Phone 7.x and Windows Phone 8. It contains all the information you might need for:

Resolutions in Windows Phone 7 & 8
Application assets (screenshots, splash screens, application icons, etc)
Accent colors
Available icons

Download it, print it, love it.

Thanks to @winphonegeek for finding this.

Weekly Links–New Year 2013 Edition!

2013-01-02T17:45:17Z

Windows Phone

Best Apps For Your New Windows Phone Device – not at all comprehensive, but a decent starting point.

Reverse GeoCode for Windows Phone 8 – Give the Nokia Map control in Windows Phone 8 a lat/lon and get an address. Must attempt.

Create a Windows Phone Live Tile In the People Hub Style

Design and Usability

Sesame’s Best Practices Guide for Children’s App Development – A very cool guide to touch-screen tablet based app development aimed at kids under 5 or 6.

What software people can learn from great Lego design – pretty high level but very interesting look into design, customer feedback and usability.

Detect Kids Corner Programmatically in Windows Phone 8

Other Stuff

Teaching ROBOTC for Lego Mindstorms - A guide to Lego Mindstorms from Carnegie Mellon Robotics Academy

Why I Quit Being So Accommodating – from 1922, an essay from a gentleman who resolved to no longer be known as “’General Attender to Things,’ or ‘Pinch Hitter,’ or ‘Fine Old Scout.’” Filed under “the more things change the more they stay the same”.