Creating A Live Tile In Windows 8

by JesseLiberty | Comments 4

Continuing my series of Blog posts that distill the presentations I’m giving this month in Europe and the UK, today I’ll take a look at creating a Live Tile.  LiveTile

Live tiles tell the user that something interesting is happening in your application, or that you have new information for them. 

Live tiles are an essential and exciting part of Windows 8 and creating a Live tile is not very difficult. In fact, creating a simple Life tile is, well, simple.

To start, create a new blank application and name it LiveTile.  The very first thing to do is to add the NotificationsExtensions project that Microsoft are* shipping with the SDK and with the Sample applications on tiles.

*I’m in the UK right now, and here corporations are plural(!)

On the home page, create a button,

   1: <Button Name="CreateLiveTile"
   2:         Content="Create"
   3:         Click="CreateLiveTile_Click_1" />

When the button is clicked, we’re going to send text to the tile. 

Note that there are two ways to send text to a tile:

  • From within the application as we are doing here
  • Using the Windows Notification Service (NWS) covered in a future blog post

In the event handler for the button click event, we start by creating a wide and a square tile with the new text we want to display,

   1: private void CreateLiveTile_Click_1(object sender, RoutedEventArgs e)
   2: {
   3:     ITileWideText03 tileContent = TileContentFactory.CreateTileWideText03();
   4:     tileContent.TextHeadingWrap.Text = "Jesse's Tile Notification";
   5:  
   6:     ITileSquareText04 squareContent = TileContentFactory.CreateTileSquareText04();
   7:     squareContent.TextBodyWrap.Text = "Jesse's Tile Notification";

We then attach the square tile to the wide tile,

   1: tileContent.SquareContent = squareContent;

Create an instance of TileNotification by calling CreateNotification on the wide tile,

   1: TileNotification notification = tileContent.CreateNotification();

Create an instance of TileUpdater by calling CreateTileUpdaterForApplication on the TileUpdateManager,

   1: TileUpdater updater = TileUpdateManager.CreateTileUpdaterForApplication();

Pass the notification to the Update method of the TileUpdater,

   1: updater.Update(notification);

That’s all there is to it. If you switch to  your tile in the start menu, you’ll see the message pop into view.

You can find the source for this example here

About the author

Jesse Liberty

Jesse Liberty

is a Technical Evangelist for Telerik and has three decades of experience writing and delivering software projects. He is the author of 2 dozen books and has been a Distinguished Software Engineer for AT&T and a VP for Information Services for Citibank and a Software Architect for PBS. You can read more on his personal blog and his Telerik blog or follow him on twitter

4 Comments

Andreas
After a ton of Google'ing, I finally came across this. What I wanted to ask was whether you know how to make the live tile shift between the "normal tile image", and the tileContent text? I'd love it if it flipped around just like other apps. Thanks!
Michael Raj
Is there any way to create an outlook 2013 live tile for the email interface instead of using Microsoft's Mail option? 
ad
thank u very much really saved my time
vivek srinivasan
Finally relieved in showing dynamic content and how to add an image along with the content in the live tile sir??

Comments

  1.    
      
      
       
  2. (optional, emails won't be shown on public pages)
  3. (optional)
Read more articles by JesseLiberty - or - read latest articles in Developer Tools