How to Periodically Update Tile without using Push Notification Service?

Targeting Windows 8.1 Update, Widows Store, Windows Phone and Universal Apps allow updating tile without the need of writing a background agent/process or push notification service.

This feature is provided under a new section in manifest file of relative solution that takes recurrence frequency ranging from half hour to daily and a URI of the form,

https://<URIHere.com>/TileUpdate.aspx?language={language}&region={region}

As obvious, all you need to do is implement a website that offers live tile images depending upon your desired template. Please see complete catalog of tile templates that can be used in Windows Store and Windows phone applications.

For the purpose of this blog post, I’ll make use of following template since it offers an image and some level of content.

So let’s begin with creation of an empty website that will hosted on Microsoft Azure in our case.

Once solution is configured, I’ll simply introduce a web page named TileUpdate.aspx that upon being called each time requests an external RESTFUL API that offers a random cat fact, get the JSON response back (using HttpClientlibrary), deserialize the JSON string into relative POCO class (using NewtonSoft.json library) and use the fact string to fill the template chosen above with a hardcoded image of a beautiful cat found in Images folder.

Note that you can add relative packages for HttpClient and Newtonsoft.Json from Package Manager Consoles with Install-Package Microsoft.Net.Http and Install-Package Newtonsoft.Json commands

Here’s how the code for TileUpdate.asps.cs page looks like,

  async void Page_Load(object sender, EventArgs e) 
 {
 //Request RESTFUL API to retrieve quote of the day
 HttpClient httpClient = new HttpClient();
 string result = await httpClient.GetStringAsync("https://catfacts-api.appspot.com/api/facts?number=1");
 
 //Convert response tring into relative Plain OLD CLR Class (POCO) to easily access content as 
 //object properties
 RootObject rootObject = JsonConvert.DeserializeObject<RootObject>(result);
 
 //Retrieve language and local carried in each tile update poll request made by app
 //These values can be used to fulfill requests depending upon local
 //e.g. after retrieving cat fact, use language to conver the fact string into relative language
 string strLanguage = Request.QueryString["language"];
 string strRegion = Request.QueryString["region"];
 
 //Now create tile using template defined at
 //https://msdn.microsoft.com/en-us/library/windows/apps/hh761491.aspx#TileWidePeekImage01
 Response.Clear();
 Response.ContentType = "text/xml; charset=utf-8";
 
 StringBuilder xmlString = new StringBuilder();
 
 xmlString.Append("<tile>");
 xmlString.Append("<visual version=\"2\">");
 xmlString.Append("<binding template=\"TileWide310x150PeekImage01\" fallback=\"TileWidePeekImage01\">");
 xmlString.Append("<image id=\"1\" src=\"https://pollsite.azurewebsites.net/images/Tile.jpg\" alt=\"alt text\" />");
 xmlString.Append("<text id=\"1\">Cat Fact</text><text id=\"2\">");
 xmlString.Append(rootObject.facts[0]);
 xmlString.Append("</text></binding></visual></tile>");
 
 // Write and 
 Response.Write(xmlString.ToString());
 
 // Flush the response to send it
 Response.Flush();
 }

Since we are making an Async request on Page Load event, it is necessary to mark the Page directive with Async="true" in TileUpdate.aspx page.

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TileUpdate.aspx.cs" Inherits="pollsite.TileUpdate" Async="true"  %>

I was unable to push .png images from server somehow. It may be due to larger size however the same worked for me with JPG (744 x 360 with 96 dpi worked fine for me for chosen template)

Note that despite I have retrieved language and region information from query string, I haven’t made use of that however that can be used in variety of ways. For example after fetching the cat fact, you can convert it into language the request is coming from.

After publishing the site on Azure, here’s the end Url,

https://pollsite.azurewebsites.net/TileUpdate.aspx

That’s it, all we need to do now is to set above URI in our app and set the recurrence frequency to half an hour and every 30 minutes a random cat fact will be displayed on your live tile. Note that I'm making use of wide tile (310 x 150) as specified in manifest file. 

Launch your app, pin the wide tile on start screen and as soon as the app will be launched the tile will be updated as shown below,

Note that the URI is only requested as soon as you launch the app for the first time (installation), upon recurrence frequency is met (half hour, one hour, etc.) or when you uninstall the app as well. If the app is pinned to start screen and you republish the app, the URI will not be called so make sure during testing that you uninstall the app each time.

The code for website and a blank windows store app is attached for testing purposes.

Website & App.zip

Comments

• Anonymous
  April 28, 2014
  Thanks, its work :-)

• Anonymous
  June 01, 2014
  The link of website and App.zip is not opening.