Metro Tile Notifications in C#

Question

I'm trying to put together a simple Windows 8 metro style app in c# with tile notifications but I can't seem to get them working.

What I can't quite figure out yet is where the code to update the tile notifications should reside. I've had a look at the Javascript sample, but I'm not seeing how that works in a C# app. Has anyone got some sample code or a quick tip on where tile updates should happen in a C# metro app?

Answer 1

My understanding is that every app decides where to do this for itself. Normally, you'd do it whenever you're also updating your normal UI with the same data - e.g. if your app is an RSS reader, and you've just downloaded a new item to display, that's where you also update your tile by posting a notification. In the sample JavaScript app, this is done from event handlers for controls for the sake of convenience.

As for the code to change the tile, it should be almost identical to JavaScript version, since in both cases you use Windows.UI.Notifications namespace. Following is a very simple C# app that updates the tile when you click the button. XAML:

<UserControl x:Class="TileNotificationCS.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    d:DesignHeight="768" d:DesignWidth="1366">
    <StackPanel x:Name="LayoutRoot" Background="#FF0C0C0C">
        <TextBox x:Name="message"/>
        <Button x:Name="changeTile" Content="Change Tile" Click="changeTile_Click" />
    </StackPanel>
</UserControl>

and code behind:

using System;
using Windows.Data.Xml.Dom;
using Windows.UI.Notifications;
using Windows.UI.Xaml;

namespace TileNotificationCS
{
    partial class MainPage
    {
        TileUpdater tileUpdater = TileUpdateManager.CreateTileUpdaterForApplication();

        public MainPage()
        {
            InitializeComponent();
        }

        private void changeTile_Click(object sender, RoutedEventArgs e)
        {
            XmlDocument tileXml = TileUpdateManager.GetTemplateContent(TileTemplateType.TileWideText01);
            XmlElement textElement = (XmlElement)tileXml.GetElementsByTagName("text")[0];
            textElement.AppendChild(tileXml.CreateTextNode(message.Text));
            tileUpdater.Update(new TileNotification(tileXml));
        }
    }
}

Don't forget that you need a wide tile for text to show up - to get it, set some image for "Wide Logo" in Package.appxmanifest.

Answer 2

Make sure you change the Initial rotation to Landscape, set some image for Widelogo, and use this method to set the text along with an expiry.

 void SendTileTextNotification(string text, int secondsExpire)
        {
            // Get a filled in version of the template by using getTemplateContent
            var tileXml = TileUpdateManager.GetTemplateContent(TileTemplateType.TileWideText03);

            // You will need to look at the template documentation to know how many text fields a particular template has       

            // get the text attributes for this template and fill them in
            var tileAttributes = tileXml.GetElementsByTagName("text");
            tileAttributes[0].AppendChild(tileXml.CreateTextNode(text));

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

            // send the notification to the app's default tile
            TileUpdateManager.CreateTileUpdaterForApplication().Update(tileNotification);
        }

Here is a detailed explanation http://www.amazedsaint.com/2011/09/hellotiles-simple-c-xaml-application.html