Tile Notifications

NotificationsExtensions for Windows 10 fully supports adaptive tile templates and special adaptive templates. It does not support the legacy tile templates (other than the Iconic template) since we do not recommend using these legacy templates in Windows 10. If you need those, you could download the Windows 8 source code of NotificationsExtensions.

Supported tile binding content choices

You can specify your tile's size-specific content with a number of different tile binding content choices...

• Adaptive Tile templates: Used via TileBindingContentAdaptive. To learn more about adaptive, click here.

• Iconic Tile template: Used via TileBindingContentIconic. To learn more about the iconic template, click here.

• Special Tile templates: Special adaptive templates for Contact, People, and Photos that provide unique animations and layouts. Used via TileBindingContentContact, TileBindingContentPeople, and TileBindingContentPhotos.

Quickstart: Generating tile notifications

The recommended pattern is as follows

1. Create tile binding content for each specific size
2. Create a TileContent object, containing each size binding
3. Get the XML from the TileContent object
4. If local app, pass the XML to TileNotification and send the notification. If server, push the XML to the push channel.

First, add the namespace declaration for Tiles (and add a reference to NotificationsExtensions if you haven't yet)...

using NotificationsExtensions.Tiles;

Then, create your binding content for specific tile size

TileBindingContentAdaptive bindingContent = new TileBindingContentAdaptive()
{
    PeekImage = new TilePeekImage()
    {
        Source = new TileImageSource("Assets/PeekImage.jpg")
    },

    Children =
    {
        new TileText()
        {
            Text = "Notifications Extensions",
            Style = TileTextStyle.Body
        },

        new TileText()
        {
            Text = "Generate notifications easily!",
            Wrap = true,
            Style = TileTextStyle.CaptionSubtle
        }
    }
};

In most cases, you should generate binding content for each specific tile size

Then generate a TileBinding object, which will contain your previously created tile binding content...

TileBinding binding = new TileBinding()
{
    Branding = TileBranding.NameAndLogo,

    DisplayName = "Custom name",

    Content = bindingContent
};

In most cases, you should generate bindings for each specific tile size

Now generate a TileContent object, which will host your TileBinding object. In this scenario, we're using the same binding for every tile size (except Small, which we've omitted). In the real world, you'll probably want to have separate tile bindings for each size. It's often a good idea to use the Iconic template for your Small tile.

TileContent content = new TileContent()
{
    Visual = new TileVisual()
    {
        TileMedium = binding,
        TileWide = binding,
        TileLarge = binding
    }
};

Finally, you can retrieve the XML from the TileContent object and use it in a WinRT TileNotification!

XmlDocument doc = content.GetXml();

// Generate WinRT notification
new TileNotification(doc);

Alternatively, if you're on a server sending push notifications, you can get the XML as a string to push down to the channel.

string xml = content.GetContent();

The generated XML looks something like...

<?xml version="1.0" encoding="utf-8"?>
<tile>
    <visual>
        <binding template="TileMedium" branding="nameAndLogo" displayName="Custom name">
            <image src="Assets/PeekImage.jpg" placement="peek" />
            <text hint-style="body">Notifications Extensions</text>
            <text hint-style="captionSubtle" hint-wrap="True">Generate notifications easily!</text>
        </binding>
        <binding template="TileWide" branding="nameAndLogo" displayName="Custom name">
            <image src="Assets/PeekImage.jpg" placement="peek" />
            <text hint-style="body">Notifications Extensions</text>
            <text hint-style="captionSubtle" hint-wrap="True">Generate notifications easily!</text>
        </binding>
        <binding template="TileLarge" branding="nameAndLogo" displayName="Custom name">
            <image src="Assets/PeekImage.jpg" placement="peek" />
            <text hint-style="body">Notifications Extensions</text>
            <text hint-style="captionSubtle" hint-wrap="True">Generate notifications easily!</text>
        </binding>
    </visual>
</tile>