XML for TileSquare71x71IconWithBadge Template in Live tiles

Question

Microsoft have a long list of great Live Tile templates, but no real guide on how to make them. I am trying to put together the XML for TileSquare71x71IconWithBadge, but the example XML is missing from that list for this one. What would that XML look like? The closest I have gotten is this, but it does not work:

<?xml version="1.0" encoding="utf-8" ?>
<tile>
  <visual version="3">
    <binding template="TileSquare71x71IconWithBadge" fallback="null">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">36</text>
    </binding>
  </visual>
</tile>

The only change to the tile with this is that 36 is in the bottom left corner of the tile; however, all of the example template xml files they have work great.

(Note: The template I am after is at the very bottom of the page.)

enter image description here

have you made it work ? if yes please help me i am kind of stuck here :( — loop, Dec 08 '14 at 20:45

score 0 · Answer 1 · answered Jul 27 '14 at 01:21

You have to send badge notification seperatly. following is the code on how to send badge notification after updating live tile

 XmlDocument badgeXml = BadgeUpdateManager.GetTemplateContent(BadgeTemplateType.BadgeNumber); 
        XmlElement badgeElement = (XmlElement)badgeXml.SelectSingleNode("/badge");
        badgeElement.SetAttribute("value", "55");
        BadgeNotification badge = new BadgeNotification(badgeXml);
        BadgeUpdateManager.CreateBadgeUpdaterForApplication().Update(badge);

Hope it helps!

Thank you, but the above image (just posted it) is the one from the template. It is not a typical badge. — Evorlor, Jul 27 '14 at 01:53

score 0 · Answer 2 · answered Jul 28 '14 at 15:04

0

The Badge must be sent separately, it's written in the description:

badge

answered Jul 28 '14 at 15:04

the_nuts

5,634
1
36
68

score 0 · Answer 3 · answered Sep 01 '14 at 07:27

The documentation for the tiles is a complete disaster! Here's the code that I'm using, I think I had to pull it from one of the sample projects, as it's not listed anywhere on the webpages themselves.

    public static TileNotification CreateMediumTile(int count)
    {
        // Get an XML DOM version of a specific template by using getTemplateContent.
        var tileXml = TileUpdateManager.GetTemplateContent(TileTemplateType.TileSquare150x150IconWithBadge);

        // You will need to look at the template documentation to know how many text fields a particular template has.
        // Get the text attribute for this template and fill it in.
        var tileImage = tileXml.GetElementsByTagName("image");
        ((XmlElement)tileImage[0]).SetAttribute("src", "ms-appx:///Assets/SquareTile71x71.png");
        ((XmlElement)tileImage[0]).SetAttribute("alt", "My App Icon");

        BadgeNotification badge;

        if (count > 0)
        {
            XmlDocument xmlDoc = new XmlDocument();
            xmlDoc.LoadXml("<badge version='3' value='" + count + "'/>");
            badge = new BadgeNotification(xmlDoc);

        }
        else
        {
            XmlDocument xmlDoc = new XmlDocument();
            xmlDoc.LoadXml("<badge version='3' value='none'/>");
            badge = new BadgeNotification(xmlDoc);
        }

        // Send the notification to the application’s tile.
        BadgeUpdateManager.CreateBadgeUpdaterForApplication().Update(badge);

        // Create the notification from the XML.
        var tileNotification = new TileNotification(tileXml);

        return tileNotification;
    }

score 0 · Answer 4 · answered Mar 17 '15 at 17:58

It's true that TileTemplateType enum not contains badge types TileSquare71x71IconWithBadge, TileSquare150x150IconWithBadge and TileWide310x150IconWithBadgeAndText but MSDN page 'The tile template catalog' contains xml descriptions of this tiles definitions. And TileNotification could be constructed using code

var xml = "<tile><visual version=\"3\"><binding template=\"TileSquare71x71IconWithBadge\"><image id=\"1\" src=\"ms-appx:///Assets/BageLogo.scale-240.png\" alt=\"alt text\"/></binding></visual></tile>";

var tile = new XmlDocument();
tile.LoadXml(xml);
var tileNotification = new TileNotification(tile);

TileUpdateManager.CreateTileUpdaterForApplication().Update(tileNotification);

Note that image in this case it path to small bage icon.

And also badge number should be updated separately using BadgeUpdateManager. Code of badge update posted in previous answers...

XML for TileSquare71x71IconWithBadge Template in Live tiles

4 Answers4