Windows 10 Development - Live Tiles


In this chapter, we will talk about the interaction with a user through tiles. It is the iconic part of Windows 10. Tiles are displayed on the Start Screen as well as on the Start Menu. In other words, it is an application icon asset, which appears in a variety of forms throughout the Windows 10 operating system. They are the calling cards for your Universal Windows Platform (UWP) app.

Tile Anatomy

There are three states of tile.

  • Basic State − Basic components of a Start tile consist of a back plate, an icon, and an app title.

Basic State
  • Semi-Live state − It is the same as the basic tile with the only difference that the badge, which is a number, can display the numbers from 0-99.

Semi-Live state
  • Live State − This tile contains all the elements of semi-live state tile and also shows additional content plate where you can put anything you want such as photos, text etc.

Updating Tiles

There are four ways to update the tiles.

  • Scheduled − You can set the template and time with ScheduledTileNotification.

  • Periodic − When information is retrieved from a URI and you can specify the time to pull the information after that period of time, such as 30min, 1 hr., 6 hrs. etc.

  • Local − Local one can be updated from your application; either from the foreground or the background app.

  • Push − It is updated from the server by pushing the information from the server.

To create a tile, follow the given code.

var tileXml = 
var tileAttributes = tileXml.GetElementsByTagName("text"); 
var tileNotification = new TileNotification(tileXml);			

Update badge is pretty simple because it is just a number and you can set the value of badge as shown below.

var type = BadgeTemplateType.BadgeNumber; 
var xml = BadgeUpdateManager.GetTemplateContent(type);  

var elements = xml.GetElementsByTagName("badge"); 
var element = elements[0] as Windows.Data.Xml.Dom.XmlElement; 
element.SetAttribute("value", "7");
var updator = BadgeUpdateManager.CreateBadgeUpdaterForApplication(); 
var notification = new BadgeNotification(xml); 

Let us create a new UWP project in Visual Studio.

  • You will see the different png files under the Assets folder in Solution Explorer.

Assets Folder
  • Let us define a default tile and its image in the package manifest.

  • Double-click on the package.appxmanifest. This opens the manifest editor window.

  • Select Visual Assets tab.

Visual Assets
  • You can select the images and icons for your application tile with any of the specified dimensions. Under the Tile Images and Logos, default images are provided for all logos such as

    • Square 71x71 Logo
    • Square 150x150 Logo
    • Square 310x310 Logo
    • Store Logo
  • When you execute your application and then go to your start screen, you will see the tile for your application.

Execute Your Application

Useful Video Courses


Windows 10

23 Lectures 2 hours

Pavan Lalwani


C# Console and Windows Forms Development with LINQ & ADO.NET

37 Lectures 13 hours

Trevoir Williams


Learn Windows & Linux Command Line

46 Lectures 3.5 hours

Fettah Ben


Active Directory with Windows Server 2016

55 Lectures 6 hours

Total Seminars


Hacking with the Windows API - Python

20 Lectures 2.5 hours

Brandon Dennis


Windows 10 installation, config, protect ad maintaining

52 Lectures 9 hours

Fabrice Chrzanowski