How to update a custom image Live Tile every minute in Windows Phone 8.1?

Question

There are quite a few Windows Phone 8.1 apps (e.g. Clock hub, Analog Clock Tile, etc.) which allow you to pin an analog clock on the main screen.

I am trying to do the same by following this sample which shows me how to update an XML document every minute.

But if I am going to create an analog clock tile then it needs to be an image.

I have tried to use XamlRenderingBackgroundTask with RenderTargetBitmap to generate the image, this bit works. What I am not sure is how can I update this image every minute.

Any help wold be greatly appreciated!

Answer 1

I took the sample you provided and modified it to generate a custom image live tile every minute.

I've tested it on my phone and it seems to be working OK. You might need to do more testing such as memory usage testing to make sure it doesn't go over the cap (maybe can reduce planTill to 30 minutes to generate less tiles in the loop?).

The UserControl xml file SquareFrontTile1.xml

<Border Height="360" Width="360" Background="#00b2f0" xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml' xmlns:mc='http://schemas.openxmlformats.org/markup-compatibility/2006'>
  <TextBlock Text="{0}" HorizontalAlignment="Left" VerticalAlignment="Top" Foreground="White" FontSize="50.667" />
</Border>

The code

public static async void UpdateAsync(BackgroundTaskDeferral deferral)
{
    TileUpdater tileUpdater = TileUpdateManager.CreateTileUpdaterForApplication();
    IReadOnlyList<ScheduledTileNotification> plannedUpdated = tileUpdater.GetScheduledTileNotifications();

    string language = GlobalizationPreferences.Languages.First();
    CultureInfo cultureInfo = new CultureInfo(language);

    DateTime now = DateTime.Now;
    DateTime planTill = now.AddHours(1);

    DateTime updateTime = new DateTime(now.Year, now.Month, now.Day, now.Hour, now.Minute, 0).AddMinutes(1);
    if (plannedUpdated.Count > 0)
        updateTime = plannedUpdated.Select(x => x.DeliveryTime.DateTime).Union(new[] { updateTime }).Max();

    StorageFolder folder = await Windows.ApplicationModel.Package.Current.InstalledLocation.GetFolderAsync("Assets");
    StorageFile file = await folder.GetFileAsync("SquareFrontTile1.xml");
    string xml = await Windows.Storage.FileIO.ReadTextAsync(file);
    string startXml = string.Format(xml, now.ToString(cultureInfo.DateTimeFormat.ShortTimePattern));

    XmlDocument tileDocumentNow = await GetTileXmlDocument(startXml);

    TileNotification notification = new TileNotification(tileDocumentNow) { ExpirationTime = now.AddMinutes(1) };
    tileUpdater.Update(notification);

    for (var startPlanning = updateTime; startPlanning < planTill; startPlanning = startPlanning.AddMinutes(1))
    {
        Debug.WriteLine(startPlanning);
        Debug.WriteLine(planTill);

        try
        {
            string updateXml = string.Format(xml, startPlanning.ToString(cultureInfo.DateTimeFormat.ShortTimePattern));
            XmlDocument updatedTileDocument = await GetTileXmlDocument(updateXml);

            ScheduledTileNotification scheduledNotification = new ScheduledTileNotification(updatedTileDocument, new DateTimeOffset(startPlanning)) { ExpirationTime = startPlanning.AddMinutes(1) };
            tileUpdater.AddToSchedule(scheduledNotification);

            Debug.WriteLine("schedule for: " + startPlanning);
        }
        catch (Exception e)
        {
            Debug.WriteLine("exception: " + e.Message);
        }
    }

    deferral.Complete();
}

private static async Task<XmlDocument> GetTileXmlDocument(string xml)
{
    Border tileUIElement = XamlReader.Load(xml) as Border;
    string liveTileImageName = string.Format("UpdatedLiveTile_{0}.png", DateTime.Now.Ticks.ToString());

    if (tileUIElement != null)
    {
        RenderTargetBitmap rtb = new RenderTargetBitmap();
        await rtb.RenderAsync(tileUIElement, 150, 150);
        IBuffer pixels = await rtb.GetPixelsAsync();
        DataReader dReader = Windows.Storage.Streams.DataReader.FromBuffer(pixels);
        byte[] data = new byte[pixels.Length];
        dReader.ReadBytes(data);

        var outputFile = await Windows.ApplicationModel.Package.Current.InstalledLocation.CreateFileAsync(liveTileImageName, Windows.Storage.CreationCollisionOption.ReplaceExisting);
        var outputStream = await outputFile.OpenAsync(Windows.Storage.FileAccessMode.ReadWrite);
        BitmapEncoder enc = await BitmapEncoder.CreateAsync(BitmapEncoder.PngEncoderId, outputStream);
        enc.SetPixelData(BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied, 150, 150, 96, 96, data);
        await enc.FlushAsync();
    }

    var tileDocument = TileUpdateManager.GetTemplateContent(TileTemplateType.TileSquare150x150Image);
    var tileImageAttributes = tileDocument.GetElementsByTagName("image");
    XmlElement tmp = tileImageAttributes[0] as XmlElement;
    tmp.SetAttribute("src", liveTileImageName);
    return tileDocument;
}