Date post: | 07-Nov-2014 |
Category: |
Technology |
Upload: | windowsphonerocks |
View: | 142 times |
Download: | 0 times |
Matthias Shapiro @matthiasshapAndy Wigley @andy_wigley
Tiles, Notifications and Action Center
Click to place personal photo
WinRT Apps +Silverlight
8.1
30 April 2014
Building Apps for Windows Phone 8.1 Jump Start
2
Introduction to Tiles and Notifications• How tiles enhance the Windows experience• Tile template examples• Tile terminology• Sending notifications• Managing notifications with the action center
This module…
Tiles and Badges for Windows
4
Tiles: What Are They Good For?
Tiles are a defining Windows experience
• Tiles across all screens• Initial interaction point for apps• Live tiles drive user engagement• Essential piece of the Windows
brand
The alternative to a “good tile” is not “no tile”
5
Users and Their Tiles
Full functionality tiles are #1 driver in high app ratings
Secondary tiles a highly sought-after feature among Windows Phone users
6
Tile Types
Tiles are cross-platform
40 cross platform tile templates available Full list: http://aka.ms/TileTemplates
Windows 8.1Tile Templates
Windows PhoneTile Templates
Tile Terminology
• PeekSecond part of an animated tile
Windows Phone
Tile Terminology
• PeekSecond part of an animated tile
• BlockLarge number text
Windows
Phone
Tile Terminology
• PeekSecond part of an animated tile
• BlockLarge number text
• Image Collection Windows Phone
My First Tile – appxmanifest
Set up primary tile in the Visual Assets section
My First Tile
Square (71 x 71)
(70 x 70)Square (150 x
150)Wide (310 x 150)
Large (310 x 310)
Tile & Badge Template Sample
<tile> <visual version="2"> <binding template="TileSquare150x150PeekImageAndText01"> <image id="1" src="{image url}" alt="MyImage"/> <text id="1">One Sample Text</text> <text id="2">Two Sample Text</text> <text id="3">Three Sample Text</text> <text id="4">Four Sample Text</text> </binding> <binding> …… </binding> </visual></tile>
<badge version="1" value="alert" />
Tile XML
Badge XML
13
Tile XML Schema tile Base tile element, contains one “visual” element Defines one (1)
tile template
visual Can contains multiple binding child elements, each of which defines a tile
binding Defines one (1) tile template
text Text used in the tile template.
image Image used in the tile template. Should match the size and shape image requirements for the template.
Tile Template Code
XmlDocument tileDoc = new XmlDocument();tileDoc.LoadXml("<my tile XML/>");
TileNotification myNewTile = new TileNotification(tileDoc);
TileUpdater myTileUpdater = TileUpdateManager.CreateTileUpdaterForApplication();myTileUpdater.Update(myNewTile);
Creating Tiles Locally
demo
Or… Use the NotificationExtensions
http://www.nuget.org/packages/windows8.notifications
ITileWideText03 tileContent = TileContentFactory.CreateTileWideText03();tileContent.TextHeadingWrap.Text = "Wide tile notification";
ITileSquareText04 squareContent = TileContentFactory.CreateTileSquareText02();tileContent.TextbodyWrap.Text = "Square tile notification";tileContent.SquareContent = squareContent;
TileNotification newTile = new TileNotification(tileContent.CreateNotification());TileUpdateManager.CreateTileUpdaterForApplication().Update(newTile);
18
NotificationsAlways on apps
Notifications
Lots of ways to display notifications
Tile ToastBadge
Raw(background
task)arbitrary
string
Toast NotificationsEnable toast in manifestSend a toast notification
User taps on toast notification to launch app
<toast> <visual> <binding template="ToastText02">
<text id="1">headline text</text> <text id="2">body text</text>
</binding> </visual></toast>
Toast Rendering
Windows Phone
Notifications
Lots of ways to send notifications
Scheduled- Set tile template and time
Periodicpull from URL every half hour / hour / 6 hours / 12 hours / day.
LocalUpdate from within application (foreground or background)
PushUsing WNS Push Services
ScheduledTileNotificationScheduledToastNotification
Scheduled updates
var scheduleToast = new ScheduledToastNotification( xmlDoc, DateTimeOffset.UtcNow + TimeSpan.FromDays(1.0) );var toastNotify = ToastNotificationManager.CreateToastNotifier();toastNotify.AddToSchedule(scheduleToast);
System Schedule
Queue
My App
Background Task
Scheduled notification
API
HTTP request for XML payloadPeriodic updates
Tile and Badge Updater APIs
My App
Background Task
Windows Services
System process 30m – 24 hour frequency
Developer
service
var periodic = TileUpdateManager.CreateTileUpdaterForApplication();Uri myTileFeed = new Uri("http://mysite.com/tileRSS.xml");periodic.StartPeriodicUpdate(myTileFeed, PeriodicUpdateRecurrence.Hour);
Windows System Services
Periodic updates (the easy way)
Open Package.appxmanifest
Local Updates
Tile and Badge Updater APIs
Toast APIs
My App
Background Task
BadgeNotification newBadge = new BadgeNotification(badgeDoc);BadgeUpdater update = BadgeUpdateManager.CreateBadgeUpdaterForApplication();update.Update(newBadge);
WNS Platform Options
Notification type
Scheduled
Local Periodic Push
Tile ✔ ✔ ✔ ✔
Badge ✔ ✔ ✔
Toast ✔ ✔ ✔
Raw ✔
Notification Queueing
Tiles can cycle notifications
Up to five (5) notifications in queue
Can replace tiles in the queue
Set expirations for tiles in queue
29
Push Notificationsone push for all devices
Windows Notification Service
One service across Windows devices
One process to register an app for push
One tile template to push to Windows & Phone apps
WNS – Push Architecture
1. Request Channel URI
2. Register with your Cloud Service
3. Authenticate & Push Notification
Windows Phone 8.1
Windows Notification
Client Platform
My Windows Phone App
My Developer Service
Windows Push Notification
Service
1
2
3
3
Setting Up An App For Push
Setting Up An App For Push
Setting Up An App For Push
Setting Up An App For Push
Setting Up An App For PushGet Channel URL
void gotNotification(PushNotificationChannel sender, PushNotificationReceivedEventArgs args){ Debug.WriteLine(args.NotificationType.ToString());}
var channel = await PushNotificationChannelManager.CreatePushNotificationChannelForApplicationAsync();SaveUriForNotificationService(channel.Uri); channel.PushNotificationReceived +=channel_PushNotificationReceived;
Sending Push Notifications
Sample Project for Push Notifications[URL for notification sample service project, visible at http://pushtestserver.azurewebsites.net/wns/ ]
Use Azure Notification Hub
Cross device notifications
http://aka.ms/notifyhub
Notifications Simulation Engine
Push Notification Simulation
demo
40
Action Centermanaging your notification space
Action Center – User Experience
20 Notifications per app
Persistent notifications for 7 days (or shorter)
Users can - “chase” (tap) a notification (removes it from the action center)- remove a group of notifications- remove all notifications
Available on Phone only (not Windows)
Action Center Management APIs
Manage app notifications
Developers can• Remove one or many notifications• Tag and group notifications• Replace a notification with a new one• Set an expiration on notifications• Send “Ghost Toast” notifications (only show up in the
notification center)
Tags, Groups, And Replacing NotificationsMatching Tag and Group will trigger replacement
Scenario – hourly stock price
ExampleToastNotification toasty = new ToastNotification(doc);toasty.Tag = "Windows Phone";toasty.Group = "JumpStart";
Set Expiration for NotificationScenario – Limited time price, time-sensitive information
ExampleToastNotification toasty = new ToastNotification(doc);toasty.Tag = "Windows Phone";toasty.Group = "JumpStart";toasty.ExpirationTime = (DateTimeOffset.Now + TimeSpan.FromHours(2));
Remove NotificationsScenario – sold out deal
Example
ToastNotificationHistory tnh = ToastNotificationManager.History;tnh.Remove("WindowsPhone");tnh.RemoveGroup("JumpStart");
Set “Ghost Toast” (suppress toast popup)Scenario – low priority social notifications
ExampleToastNotification toasty = new ToastNotification(doc);toasty.Tag = "Windows Phone";toasty.Group = "JumpStart";toasty.ExpirationTime = (DateTimeOffset.Now + TimeSpan.FromHours(2));toasty.SuppressPopup = true;
Action Center in Action
demo
48
Go Forth And Notify!
©2014 Microsoft Corporation. All rights reserved. Microsoft, Windows, Office, Azure, System Center, Dynamics and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.