Ever since Windows Phone came out, I have always contended that Live tiles are the coolest feature and one that is :

1) Not on any other platform (Yes, I know that Android has widgets… not the same thing)

2) A great way to drive people into your application. (Which you want if it is add based.)

 

I will do another post later about why you should do Live Tiles from a Monetizing standpoint, but for this post, I just want to show you how easy it is to work with live tiles.

 

To begin with, live tiles have been around since 7.0 but to really take advantage of them you had to use Push Notifications.  While this is not THAT difficult, it did add quite a bit of complexity and the need to host your own service (or use scheduled tiles).  In the Mango release, we have made 4 great additions to live tiles.

 

1) You can change the live tiles from your code.

2) You can create secondary tiles to deep link into specific pages of your application

3) You can write on the back of tiles and have them flip

4) You can use background process to have them change when not even in your application

 

To create and modify live tile is fairly simple.

This firs thing we want to do is create a simple windows phone page that has three buttons on it:

• Create App Tile
• Create Second Tile
• Delete Secondary Tile

Next we need to go to code behind and add a using statement for the phone shell.

 

using Microsoft.Phone.Shell;

Then inside the first button click we add the following code :

 

 private void button1_Click(object sender, RoutedEventArgs e)
        {

            //Tile is always the first Tile, even if not pinned .
            ShellTile TileToFind = ShellTile.ActiveTiles.First();

            if (TileToFind != null)
            { 

                StandardTileData NewTileData = new StandardTileData();

                NewTileData.Title = "My Cool Tile";
                NewTileData.BackgroundImage = new Uri(
                    "CoolTile.jpg", UriKind.Relative);
                NewTileData.Count = 5;

                NewTileData.BackTitle = "Tiles Got Back";
                NewTileData.BackBackgroundImage = new Uri(
                    "CoolTileBack.jpg", UriKind.Relative);

                TileToFind.Update(NewTileData);

            }

        }

• The first thing we do is get a reference to the Live Tile that comes with your application. (TileToFind)
• Once we have a reference to it we can create our new tile data using the StandardTileData class.
• We set the properties including the image we want on the live tile (a 173 by 173 png or jpg… make sure that your image is set to “content” in your project or you will not see it)
• Next we set the back of the tile
• And finally call the update method to change the live tile.

 

That is all you need to do to change your live tile.

If you want to create a secondary tile, it is slightly different.

 

for the second button click event we do the following

private void button2_Click(object sender, RoutedEventArgs e)
        {
            ShellTile SecondTile = ShellTile.ActiveTiles.FirstOrDefault(
                x => x.NavigationUri.ToString().Contains("Page2.xaml"));

            StandardTileData NewTileData;
            NewTileData = new StandardTileData();

            NewTileData.Title = "Secondary Tile";
            NewTileData.BackgroundImage = new Uri(
                "CoolTile.jpg", UriKind.Relative);
            NewTileData.Count = 5;
            NewTileData.BackTitle = "Second Tiles Got Back";
            NewTileData.BackBackgroundImage = new Uri(
                "CoolTileBack.jpg", UriKind.Relative);

            if (SecondTile == null)
            {
                ShellTile.Create(new Uri(
                    "/Page2.xaml", UriKind.Relative), NewTileData);
            }
            else
            {
                SecondTile.Update(NewTileData);
            }
        }

 

There are a couple of noticeable change.  To find the secondary tile, we need to search for it since we are not guaranteed that it exists.  We do this by searching the ActiveTiles collection for the NavigationUri of the tile that we set lower in the event.  The only other change is creating the tile if it does not exist.  Otherwise we update it like before.

If you want to run this code in the background so you can change the tile while users are not using the phone. You can check out my post on Background Agents

 

Enjoy

Related Posts:

• PhoneGap for Windows Phone
• Windows Phone App of the Day–LilDemonsSpplatter
• Nokia Developer Program
• Free Windows Phone Workshops
• Windows Phone App of the Day : FourSquare