Windows Tile Updater (Part 3 - Move the code to a shared project and create the Phone App)

May 13, 2014

In the third part of my series on creating a universal app, I’m going to transfer the code that we created in part 2 and move it into a shared project.

If you want to have a look at the source code, or just use it for something, it’s here:

So far, we have code to update the tile, but it’s in the Windows 8.1 app. Let’s just move that to the shared project:


TileUpdater.cs looks like this:

    public class UpdateTile
        private static void UpdateTileImage(string image)
            XmlDocument xmlDoc = TileUpdateManager.GetTemplateContent(TileTemplateType.TileWide310x150Image);

            XmlElement imageNode = (XmlElement)xmlDoc.GetElementsByTagName("image")[0];
            imageNode.SetAttribute("src", string.Format("ms-appx://{0}", image));

            Windows.UI.Notifications.TileUpdater tileUpdater = TileUpdateManager.CreateTileUpdaterForApplication();
            TileNotification tileNotification = new TileNotification(xmlDoc);

        public static void UpdateTileImage()
            string image = "/Assets/test.png";

You might notice this is precisely the same code. The button click event on the main page looks like this now:

        private void Button\_Click(object sender, RoutedEventArgs e)

Now, run again and the behaviour should remain the same. This isn’t much - I mean, if you’re reading this and have just found out how to separate code from the main program then you might be reading the wrong blog. So, let’s try wiring up the phone app. We’ll start with the XAML:




The XAML is familiar - I copied it verbatim from the Win 8 app (as I said in the last post, I will try to rationalise this a little, although other than in a very trivial app such as this, you would probably want the XAML to be different). And the code behind:

        private void Button\_Click(object sender, RoutedEventArgs e)

And, it works:


Did it just work - just like that?

Well, no.

Okay - there was some fiddling - here’s the fiddling: 1. The app will (again) not be pinned to the start screen, you’ll need to use the emulator to do so. 2. The tile will, again, initially be a small square (half the size of a wide tile - 150 x 150); this will need to be a wide tile, and to do so, you need to press and hold and the first reduce the size, before increasing to a wide tile.


Okay - so, we now have a Windows Store and Phone App. There’s a common codebase (admittedly it’s a bit scrappy), and the phone app took around 20 seconds.

In the next post I’m going to tidy up the code and investigate options for using shared XAML.

Profile picture

A blog about one man's journey through code… and some pictures of the Peak District

© Paul Michaels 2024