Windows 8 Metro Tile Badges

In my last post I showed how to make notifications appear on an application’s start menu tile. In this post I will show another way to show information on the tile, badges. Badges are small icons that show up in the lower right corner of a tile on top of either the default startup tile, or on top of a notification. The process for displaying a badge is pretty much the same as displaying a notification, it just uses difference classes.

var xmlDocument = BadgeUpdateManager.GetTemplateContent(BadgeTemplateType.BadgeNumber);
xmlData.Text = xmlDocument.GetXml();
var textNode = xmlDocument.SelectSingleNode("/badge");
textNode.Attributes[0].NodeValue = UIBadgeValue.Text;
var badge = new BadgeNotification(xmlDocument);
BadgeUpdateManager.CreateBadgeUpdaterForApplication().Update(badge);

The first line gets the XML template for the badge. There are two template types for badges, Number and Glyph. Number display a one or two digit number. For example you could use this to display the number of unread e-mails in a e-mail application. The number badge looks like this:



The second type is Glyph which displays one of a series of predefined icons. A error glyph badge looks like this:



The schema for both types of badges is the same:

<badge value=””/>  

The next two lines set the value attribute in the schema. For the number badge this will be one or two digits. For the glyph badge it will be one of the following values: none,activity,alert,available,away,busy,newMessage,paused,playing,unavailable,error The last two lines create a badge object and display it on the tile. Removing a badge works just like removing a notification:

BadgeUpdateManager.CreateBadgeUpdaterForApplication().Clear();

Just like notifications, badges have a ExpirationTime property that should control when the badge expires, but I have not had any luck getting that property to work.