Notifications & Reminder, Contact

1. Notifications & Reminder, Contact
Nguyen Tuan | Microsoft Certified Trainer

2. Agenda
 Tiles in Windows Phone 8
 Local Tiles API
 Updating Tiles from ShellTileSchedule
 Updating Tiles from Background Agents
 Lock screen notifications for Windows Phone
 Lock screen background for Windows Phone

3. Live Tiles
• Windows phone has the unique ability to provide the
end user glanceableaccess to the information they
care most about, via Live Tiles
• Push Notifications offer developers a way to send
timely information
to their applications even when they are not running
• In Windows Phone 7.1 and later, the Local Tiles API
allows apps to create and update tiles

4. Live Tiles
• Shortcuts to apps
• All apps have at least one tile, known as the default tile
• Created by user pinning your app to the Start Screen
• Launch to app main page
• Apps can create secondary tiles
• Created programmatically
• Launch to any page in your app
• Static or dynamic
• Tiles can be updated
• Application code
• Background agents
• Push Notifications
• In Windows Phone 7.1, only one tile size for third party apps
• In Windows Phone 8.0, you can support three different tile sizes
4

5. Tile Templates and Tile Sizes
• Windows Phone 8 supports three Tile
templates
• Flip – flips from front to back (similar to
the WP 7.1 Tile template)
• Iconic – clean iconic layout designed to
reflect Windows Phone design principles
• Cycle – cycles through up to nine images
5

6. Tile Content
• The Tile content is built up from a fixed set of data properties
• Data Properties for Text elements, Count elements and Image elements
• Content that displays depends on the template you choose and the tile size
• Not all elements need to be used
• Not all elements used in all templates
• WXGA resolution Image sizes
• Automatically scaled for WVGA and 720p
6
Tile Size Flip and Cycle Images Iconic Images
Small 159 x 159 pixels 159 x 159 pixels 110 x 110 pixels
Medium 336 x 336 pixels 336 x 336 pixels 202 x 202 pixels
Wide 691 x 336 pixels 691 x 336 pixels N/A

7. Flip Tile Template
• Flips from front to
back
• Small size does not
flip
• Medium size is the
same as the WP7.1
tile template
8/16/2014 7

8. Cycle Tile Template
• Cycles between from 1 to 9 images
• Small tile does not cycle
8/16/2014 8

9. Iconic Tile Template
• Displays a small image in the center of the Tile and is designed to
reflect Windows Phone design principles
8/16/2014 9

10. Primary and Secondary Tiles
• Application Tile
• Can be created only when user taps and holds the application
name in the Application List and then selects pin to start
• Tile template and Properties are set initially in the Application
Manifest
• Template cannot be changed programmatically
• Secondary Tile
• Can be created only as the result of user input in an application
• The application then uses the Create(Uri, ShellTileData) method
to createa Tile on Start
• Because the UI will navigate to Start when a new secondary Tile
is created, only one secondary Tile can be created at a time

11. Defining the Application Tile
• Define your images
• The standard new project
templates already contain
placeholder images of the correct
size
• FlipCycleTile*.png used for the Flip
and Cycle Tile templates
• IconicTile*.png used for the Iconic
Tile templates
• Replace these images with your
own artwork
8/16/2014 11

12. Defining the Application Tile in the Application
Manifest
• Double-click WMAppManifest.xml to open using the new Manifest
Editor
• On the Application UI tab, set the Tile Template, optional Title and
Tile Images
8/16/2014 12

13. Demo:
Application Tile

14. Creating and Updating Tiles with the Local Tile API
• Localtileupdates(these are*not*push)
• Fullcontrolofallproperties whenyourapp
isintheforeground orbackground
• ManageSecondaryTiles
• Create/Update/Delete
• Launchesdirectly topage/experience

15. Creating Tiles
public static void SetTile(RecipeDataItem item, string NavSource)
{
FlipTileData tileData = new FlipTileData()
{
//Front square data
Title = item.Title,
BackgroundImage = new Uri("ms-appx:///background1.png", UriKind.Relative),
SmallBackgroundImage = new Uri("ms-appx:///smallbackground1.png", UriKind.Relative),
//Back square data
BackTitle = item.Title,
BackContent = item.Ingredients,
BackBackgroundImage = new Uri("ms-appx:///backbackground1.png", UriKind.Relative),
//Wide tile data
WideBackgroundImage = new Uri("ms-appx:///widebackground1.png", UriKind.Relative),
WideBackBackgroundImage = new Uri("ms-appx:///widebackbackground1.png", UriKind.Relative),
WideBackContent = item.Directions
};
// Create Tile and pin it to Start. Causes a navigation to Start and a deactivation of our application
ShellTile.Create(new Uri("/RecipePage.xaml?DefaultTitle=FromTile", UriKind.Relative), tileData, true);
}

16. Updating Tiles
// Find the Tile we want to update.
ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(
x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
// If the Tile was found, then update the Title.
if (TileToFind != null)
{
FlipTileData NewTileData = new FlipTileData
{
Title = textBoxTitle.Text
};
TileToFind.Update(NewTileData);
}

17. Updating the Application Tile
public static void UpdateMainTile(RecipeDataGroup group)
{
//Get application's main tile – application tile always first item in the ActiveTiles collection
//whether it is pinned or not
var mainTile = ShellTile.ActiveTiles.FirstOrDefault();
IconicTileData tileData = new IconicTileData()
{
Count = group.RecipesCount,
BackgroundColor = Color.FromArgb(255, 195, 61, 39),
Title = "Contoso Cookbooks",
IconImage =
new Uri("ms-appx:///local/shared/shellcontent/newMedLogo.png", UriKind.RelativeOrAbsolute),
SmallIconImage =
new Uri("ms-appx:///local/shared/shellcontent/newSmlLogo.png", UriKind.RelativeOrAbsolute),
WideContent1 = "Recent activity:",
WideContent2 = "Browsed " + group.Title + " group",
WideContent3 = "with total of " + group.RecipesCount + " recipes"
};
mainTile.Update(tileData);
}

18. Demo:
1.WPTileExample(Create, Update,Delete)
2.TilesApp(Update)

19. Updating Tiles with a Tile Schedule
• Periodically updates the tile image without pushing message though
• Can only update the image on the front of the tile
• Updates images only from the web, not from the app local store
• Sets up notification channel and binds it to a tile notification
• Few limitations
• Image size must be less than 150 KB (up from 80KB in WP7.1)
• Download time must not exceed 45 seconds (up from 30 seconds in 7.1)
• Lowest update time resolution is 60 minutes
• If the schedule for an indefinite or finite number of updates fails too many times, OS will cancel it
• Update recurrence can by Onetime, EveryHour, EveryDay, EveryWeek
or EveryMonth
19

20. Scheduling Tile Update
20
public partial class MainPage : PhoneApplicationPage
{
ShellTileSchedule SampleTileSchedule = new ShellTileSchedule();
private void buttonIndefinite_Click(object sender, RoutedEventArgs e)
{
// Updates will happen on a fixed interval.
SampleTileSchedule.Recurrence = UpdateRecurrence.Interval;
// Updates will happen every hour.
// Because MaxUpdateCount is not set, the schedule will run indefinitely.
SampleTileSchedule.Interval = UpdateInterval.EveryHour;
SampleTileSchedule.RemoteImageUri = new
Uri(@"http://www.weather.gov/forecasts/graphical/images/conus/MaxT1_conus.png");
// Updates will apply to the application tile.
SampleTileSchedule.Start();
}
}

21. Scheduling Secondary Tile Updates
21
foreach (ShellTile TileToSchedule in ShellTile.ActiveTiles)
{
ShellTileSchedule mySchedule = new ShellTileSchedule(TileToSchedule);
mySchedule.Interval = UpdateInterval.EveryHour;
mySchedule.Recurrence = UpdateRecurrence.Interval;
mySchedule.RemoteImageUri = imageURI;
mySchedule.Start();
}
• Can also schedule updates for secondary tiles by passing the ShellTile
object into the ShellTileSchedule constructor

22. Updating Tiles From a Background Agent
• In Windows Phone OS 7.0, only way of updatingLive Tiles was from a
Tile Schedule
or from Push Notifications
• Tile Schedule needs to fetch images from a web URI
• Push Notifications require you to implement a backend service
• To have control of shell tiles when the app is not running without
using Push Notifications, a good solution is a Background Agent
• Use the ShellTile API to locate and update tiles

23. Demo:
Update Tile From Agent

24. 8/16/2014 24
Lock screen notifications

25. • End user can now select any app
that has been enabled for lock
screen notifications to show
detailed status
• Select any five apps to show quick
status (icon and count)
• For your app to be included in the
notifications area, all you have to
do is
• Create an icon
• Declare the app’s intent in the
application manifest file
8/16/2014 25
Lock Screen on Windows Phone 8

26. • Create a 24 x 24 pixel PNG image that will be used to identify your app
on the lock screen
•Contain only white pixels and transparent background
• Default name is LockIcon.png
•Use this name and you do not have to explicitly declare it in the application
manifest
• If you use another name,
•Edit WMAppManifest.xml using
the XML editor
•Change the DeviceLockImageURI
element which is listed inside the
Tokens element:
Creating a lock screen icon
8/16/2014 26
<Tokens>
<PrimaryToken TokenID="PhoneApp4Token" TaskName="_default">
<TemplateFlip>
…
<DeviceLockImageURI>MyLockIcon.png</DeviceLockImageURI>
</TemplateFlip>
</PrimaryToken>
</Tokens>

27. • Edit WMAppManifest.xml with the XML editor
•Find the <Extensions> element. If not there, create it immediately following the
<Tokens> element.
•Inside the <Extensions> element, create <Extension> elements for each feature
you want to support: Icon Count and/or Text
<Extensions>
<Extension ExtensionName="LockScreen_Notification_IconCount"
ConsumerID="{111DFF24-AA15-4A96-8006-2BFF8122084F}" TaskID="_default" />
<Extension ExtensionName="LockScreen_Notification_TextField"
ConsumerID="{111DFF24-AA15-4A96-8006-2BFF8122084F}" TaskID="_default" />
</Extensions>
Updating the Application Manifest File
8/16/2014 27

28. • Lock Screen Icon Count and Text is taken directly from your applications
primary tile
• Secondary tiles are not used for this feature
• Information is only displayed on the lock screen if the tile contains the
information
• For example, a count will only be displayed if the tile displays it
• Primary tile does not need to be pinned to the Start Screen for lock screen
notifications to be enabled
• Update Primary Tile content in the usual way
• LocalShell Tiles API
• Push Notifications
How to Update the Icon Count and Text
8/16/2014 28

29. • Simulation Dashboard allows
you to display the Lock Screen
on the emulator
• Access the Simulation
Dashboard from the Visual
Studio Tools menu
Testing with the Simulation Dashboard
8/16/2014 29

30. Demo:
Lock Screen

31. 8/16/2014 31
Lock Screen Background

32. • End user can choose a background image
from their own photos or search for an
image on Bing
• In addition, they can choose an app to be
the background image provider
• For your app to be a lock screen
background provider, all you have to do is
• Declare the app’s intent in the application
manifest file
• Write code to change the background image
8/16/2014 32
Lock Screen Background

33. • Edit WMAppManifest.xml with the XML editor
•Find the <Extensions> element. If not there, create it immediately following the
<Tokens> element.
•Inside the <Extensions> element, create an <Extension> element for
LockScreen_Background
<Extensions>
<Extension ExtensionName="LockScreen_Background"
ConsumerID="{111DFF24-AA15-4A96-8006-2BFF8122084F}" TaskID="_default" />
</Extensions>
Updating the Application Manifest File
8/16/2014 33

34. Write Code to Change the Lock Screen Background
private async void lockHelper(Uri backgroundImageUri, string backgroundAction)
{
try
{
//If you're not the provider, this call will prompt the user for permission.
//Calling RequestAccessAsync from a background agent is not allowed.
var op = await LockScreenManager.RequestAccessAsync();
//Check the status to make sure we were given permission.
bool isProvider = LockScreenManager.IsProvidedByCurrentApplication;
if (isProvider)
{
//Do the update.
Windows.Phone.System.UserProfile.LockScreen.SetImageUri(backgroundImageUri);
System.Diagnostics.Debug.WriteLine("New current image set to {0}", backgroundImageUri.ToString());
}
else
{
MessageBox.Show("You said no, so I can't update your background.");
}
}
catch (System.Exception ex)
{
System.Diagnostics.Debug.WriteLine(ex.ToString());
}
}

35. • Call to
LockScreenManager.RequestAccess
Async is required
•Checks if your app is already the selected
lock screen background provider
•If not, prompts user for permission to make
your app the selected provider
User Confirmation
8/16/2014 35
//If you're not the provider, this call will prompt the user for permission.
//Calling RequestAccessAsync from a background agent is not allowed.
var op = await LockScreenManager.RequestAccessAsync();

36. • To use an image that you shipped in your app, use ms-appx:///
Uri imageUri = new Uri("ms-appx:///background1.png",
UriKind.RelativeOrAbsolute);
LockScreen.SetImageUri(imageUri);
• To use an image stored in the Local Folder, use ms-
appdata:///local/shared/shellcontent
• Must be in or below the /shared/shellcontent subfolder
Uri imageUri = new Uri("ms-
appdata:///local/shared/shellcontent/background2.png",
UriKind.RelativeOrAbsolute);
LockScreen.SetImageUri(imageUri);
Accessing Local Images
8/16/2014 36

37. Demo:
DynamicLockScreen

38. Summary
• Shell Tile API allows easy manipulation of tiles from within an application
• Tiles can have a front and a back, and apps can have secondary tiles
• Tiles and Toasts can launch into a specific page within the app
• Only the user can decide to pin an apps’ primary tile to the Start Screen, not from code
• App can declare in the App manifest that it can be a lock screen notification provider
• User must select apps to display lock screen notifications from phone Settings
• Optionally supply count and/or text – these are pulled directly from the primary tile
• App can also declare that it can be a lock screen background provider
• Code used to request permission from the user and to change the lock screen
background