Windows 8 动手实验系列教程 实验7：磁贴和通知

动手实验

实验7：磁贴和通知

 

 

2012年9月

 

简介

磁贴是Windows应用商店应用用户体验的重要元素。当应用程序被安装后，它的磁贴将在Windows 8开始屏幕被建立。该磁贴(称为主磁贴)做为启动应用程序的快捷方式。默认状况下，主磁贴的图像来自Logo.png文件，它由Visual Studio包含在Window应用商店项目中。图像大小为150X150像素，并由它建立了一个正方形磁贴。然而，经过向项目添加一个310X150的图像并在应用程序清单中将它指定为“宽徽标”，您能够同时在应用程序中包含一个宽磁贴。若是应用程序支持宽磁贴，那么用户能够在开始屏幕上在正方形磁贴和宽磁贴之间进行切换。

Windows应用商店应用同时包含建立附加磁贴(称为辅助磁贴)的选项。辅助磁贴做为启动应用程序的快捷方式，同时为应用程序提供预约义的位置和状态。例如天气应用程序会容许用户为华盛顿州雷德蒙德和佐治亚州亚特兰大等地理位置建立辅助磁贴。用户而后能够经过简单地点击辅助磁贴启动应用程序并查看雷德蒙德或亚特兰大的天气。

您能够经过使用Windows运行时中的Windows.UI.StartScreen.SecondaryTile类建立辅助磁贴。磁贴建立一般由用户发起，例如在应用栏点击某个命令。具有建立辅助磁贴功能的应用程序提供了许多参数，包括磁贴背景图像的统一资源标识符 (URI)和一个包含激活参数的字符串。当应用程序从辅助磁贴启动时，操做系统将激活参数传递给应用程序。这些参数提供了应用程序的初始化信息。对于天气应用程序，激活参数也许仅仅是一个邮政编码。

磁贴被建立后，它没必要保持静止状态。Windows应用商店应用享有许多经过更新和推送通知使磁贴内容动态和引人注目的方法。例如应用程序可使用Windows.UI.Notifications.TileUpdater类更新磁贴的内容。这些更新能够可选地被排队。当启用队列后，操做系统每隔几秒钟轮换显示最近的五个更新，这使磁贴显得新鲜和生动。

固然应用程序须要在运行时刻才能使用TileUpdater类更新磁贴。可是磁贴甚至能够在应用程序未运行时被更新（经过Windows通知服务，WNS）。设想天气应用程序即便在未运行时也须要显示恶劣天气警报。经过Windows通知服务，天气应用程序的服务器能够发送推送通知来更新开始屏幕的磁贴。

推送通知并不局限于更新磁贴。它们也能够弹出包含用户消息的toast^注窗口（例如“在您的区域检测到恶劣天气”），而且在磁贴上显示锁屏提醒（数字或预约义的字形）。例如，设想一个提醒用户在收件箱中有新消息的邮件应用程序。

在本实验中您将经过向Contoso Cookbook添加辅助磁贴、推送通知和toast以得到关于它们的第一手体验。在结束时，用户将可以经过辅助磁贴在开始屏幕固定喜好的食谱，经过Windows通知服务查看磁贴的更新和toast的运行。

译者注：Toast指土司、面包块，这里指在相似面包块形状的长方形区域中显示的消息。

目标

本实验将向您展现如何：

• 建立辅助磁贴。
• 使用推送通知更新主磁贴。
• 使用计划toast通知用户，即便应用程序未运行。

 

系统要求

您须要下列软件完成本实验：

• Microsoft Windows 8
• Microsoft Visual Studio 2012

 

设置

您必须执行如下步骤来准备本实验的计算机：

一、安装 Microsoft Windows 8。

二、安装 Microsoft Visual Studio 2012。

 

练习

本动手实验包含如下练习：

一、合并（Incorporate）辅助磁贴

二、合并推送通知

三、合并计划toast

 

完成本实验的预计时间：30至40分钟。

 

 

练习 1: 合并辅助磁贴

在本练习中您将向项-明细页面的应用栏添加命令以容许用户在开始屏幕使用辅助磁贴固定喜好的食谱。您还将向Contoso Cookbook添加逻辑，使得当应用程序从辅助磁贴激活时可以显示相应的食谱。

任务1 – 修改应用栏

须要完成的第一项工做是向应用栏添加固定命令。而后咱们为其编写处理程序以建立辅助磁贴，点击该磁贴能够显示当前显示的食谱。

一、在Visual Studio中打开您在实验6中完成的ContosoCookbook项目。若是您还没有完成实验6或但愿从一个参考副本开始，您能够在开始材料中找到实验已完成的版本。

二、打开ItemDetailPage.xaml并在应用栏“LeftCommands”部分的结束处添加如下语句。

XAML

<Button x:Name="PinRecipeButton" HorizontalAlignment="Left" Style="{StaticResource PinAppBarButtonStyle}" Click="OnPinRecipeButtonClicked" />

 

三、打开StandardStyles.xaml并定位到被注释的样式元素中的关键字PinAppBarButtonStyle。取消注释以使代码以下所示。

XAML

<!--

        <Style x:Key="RenameAppBarButtonStyle" TargetType="ButtonBase" 
        BasedOn="{StaticResource AppBarButtonStyle}">
        <Setter Property="AutomationProperties.AutomationId" Value="RenameAppBarButton"/>
        <Setter Property="AutomationProperties.Name" Value="Rename"/>
        <Setter Property="Content" Value="&#xE13E;"/>
        </Style> -->
        <Style x:Key="PinAppBarButtonStyle" TargetType="ButtonBase" 
        BasedOn="{StaticResource AppBarButtonStyle}">
        <Setter Property="AutomationProperties.AutomationId" Value="PinAppBarButton"/>
        <Setter Property="AutomationProperties.Name" Value="Pin"/>
        <Setter Property="Content" Value="&#xE141;"/>
        </Style>
<!--
<Style x:Key="MusicInfoAppBarButtonStyle" TargetType="ButtonBase" BasedOn="{StaticResource AppBarButtonStyle}">

四、打开ItemDetailPage.xaml.cs并添加如下using语句。

C#

using Windows.UI.StartScreen;

五、如今向ItemDetailPage类添加如下方法。

C#

private async void OnPinRecipeButtonClicked(object sender, RoutedEventArgs e)
{
    var item = (RecipeDataItem)this.flipView.SelectedItem;
    var uri = new Uri(item.TileImagePath.AbsoluteUri);

    var tile = new SecondaryTile(
            item.UniqueId,              // Tile ID
            item.ShortTitle,            // Tile short name
            item.Title,                 // Tile display name
            item.UniqueId,              // Activation argument
            TileOptions.ShowNameOnLogo, // Tile options
            uri                         // Tile logo URI
        );

    await tile.RequestCreateAsync(); 
}

注意：本步骤中的磁贴徽标统一资源标识符（Tile logo URI）指向Images文件夹中的150 x 150像素的图像。辅助磁贴图像必须在本地加载。它们不能以远程方式加载（与普通的图像不一样）。

六、启动应用程序并点击某个食谱以转到项-明细页面。

七、确认应用栏包含固定(Pin)命令，如图1所示。

图 1 固定(Pin)命令

八、返回Visual Studio并中止调试。

 

任务 2 – 修改 OnLaunched

建立辅助磁贴很是简单，可是您也须要注意当应用程序从辅助磁贴激活后须要导航到项-明细页面以显示某个食谱。

一、打开App.xaml.cs并找到OnLaunched方法。

二、在if(rootFrame == null)子句前添加如下语句。

C#

if (args.PreviousExecutionState == ApplicationExecutionState.Running) 
{
    if (!String.IsNullOrEmpty(args.Arguments))
        ((Frame)Window.Current.Content).Navigate(typeof(ItemDetailPage), args.Arguments);
    Window.Current.Activate();
    return;
}

注意：当Windows应用商店应用启动后，LaunchActivatedEventArgs.Kind将告诉您应用程序启动的缘由，同时LaunchActivatedEventArgs.PreviousExecutionState将告诉您应用程序在以前的运行后是否被终止。相似地，当应用程序从辅助磁贴启动时，LaunchActivatedEventArgs.Arguments将提供激活参数，它被传递给SecondaryTile构造函数的第四个参数。您在这里所作的工做是当用户点击辅助磁贴时若是应用程序已经运行，则导航到项-明细页面以显示食谱。

三、向OnLaunched方法中对SuggestionsRequested和CommandsRequested事件的侦听(咱们在以前的实验中进行了关联)以后添加如下语句。

C#

// 若是应用程序从辅助磁贴激活，则显示食谱
if (!String.IsNullOrEmpty(args.Arguments)) 
{
    rootFrame.Navigate(typeof(ItemDetailPage), args.Arguments);
    Window.Current.Content = rootFrame;
    Window.Current.Activate();
    return;
}

任务 3 – 固定食谱

如今让咱们经过将食谱固定到开始屏幕来测试以上修改并确认当应用程序从磁贴启动后正确的食谱将被显示。

一、在调试器中按F5启动应用程序。

二、转到项-明细页面以查看您选择的食谱。

三、从屏幕底部向上滑出应用栏（或按Windows徽标键+Z）并点击Pin按钮。

四、在其后的弹出窗口中点击固定到开始屏幕（Pin to Start）按钮（图2）

图2 固定辅助磁贴

一、返回Visual Studio并中止调试。

二、转到Windows 8开始屏幕并验证如今开始屏幕包含显示该食谱的辅助磁贴。

三、点击辅助磁贴并验证Contoso Cookbook启动并显示相应的食谱。

四、按Alt+F4关闭应用程序。

 

练习 2: 合并推送通知

推送通知容许Windows应用商店应用更新磁贴（主磁贴或辅助磁贴）的内容，即便应用程序并未运行。推送通知也能够更新磁贴的锁屏提醒，它能够是0到99的数值或某个特殊的字形（例如出如今磁贴上的星号）。推送通知来自Windows通知服务（WNS）对调用的响应，这些调用来自与您的应用相关的基于云的服务。在本练习中您将向Contoso Cookbook添加推送通知。

任务 1 – 修改应用程序清单

Microsoft已经部署了一个Contoso Cookbook能够调用并订阅推送通知的Windows Azure服务，该服务经过WNS传递通知。当该服务被部署时，它被配置为向具有特定包名称和来自特定发布者（”Contoso”） 的应用传递通知。为了获取该服务发出的推送通知，您须要修改应用程序清单以使用正确的包名称和发布者身份。一般您不须要为应用程序进行上述修改，可是由于咱们须要重复使用Microsoft已经安装的Azure服务，因此咱们须要使用服务的包数据。

一、在解决方案资源管理器中双击Package.appxmanifest以打开清单。

二、在清单编辑器中单击打包(Packaging)选项卡。

三、将包名称(Package name)修改成“BUILD.87821274-9e97-488c-b5af-69dace508bff”。

四、将包显示名称(Package display name)修改成“Contoso Cookbook”。

五、将发布者显示名称(Publisher display name)修改成“Contoso”。

六、单击发布者(Publisher)这一行的选择证书(Choose Certificate)按钮。而后从配置证书(Configure Certificate)下拉列表中选择从文件中选择(Select from file)并在其后的对话框中选择Contoso.pfx。您将在开始材料的Certs文件夹中找到Contoso.pfx。而后单击肯定。

七、验证Package name, Package display name, Publisher和Publisher display name具备如图3所示的值。

图 3 被编辑的清单

八、保存修改并关闭Package.appxmanifest。

任务 2 – 订阅推送通知

为了订阅推送通知，Windows应用商店应用从Windows运行时检索一个通知通道并向服务传递通道的统一资源标识符(URI)。当服务须要更新磁贴时，它使用通道URI调用WNS。WNS而后将通知递送给应用程序。让咱们在Contoso Cookbook启动时抓取一个通道URI并使用它来订阅推送通知。

一、打开App.xaml.cs并添加如下using语句。

C#

using Windows.UI.Notifications;
using Windows.Networking.PushNotifications;
using Windows.Security.Cryptography;
using System.Net.Http;
using Windows.Networking.Connectivity;
using Windows.UI.Popups;

二、向OnLaunched方法中为CommandsRequested事件注册处理程序的语句后添加如下语句。

C#

// 清空磁贴和锁屏提醒
TileUpdateManager.CreateTileUpdaterForApplication().Clear();
BadgeUpdateManager.CreateBadgeUpdaterForApplication().Clear();

// 为推送通知进行注册
var profile = NetworkInformation.GetInternetConnectionProfile();

if (profile.GetNetworkConnectivityLevel() == NetworkConnectivityLevel.InternetAccess)
{
    var channel = await PushNotificationChannelManager.CreatePushNotificationChannelForApplicationAsync();
    var buffer = CryptographicBuffer.ConvertStringToBinary(channel.Uri, BinaryStringEncoding.Utf8);
    var uri = CryptographicBuffer.EncodeToBase64String(buffer);
    var client = new HttpClient();

    try
    {
        var response = await client.GetAsync(new Uri("http://ContosoRecipes8.cloudapp.net?uri=" + uri + "&type=tile"));

        if (!response.IsSuccessStatusCode)
        {
            var dialog = new MessageDialog("Unable to open push notification channel");
            dialog.ShowAsync();
        }
    }
    catch (HttpRequestException)
    {
        var dialog = new MessageDialog("Unable to open push notification channel");
        dialog.ShowAsync();
    }
}

注意：对CreatePushNotificationChannelForApplicationAsync的调用将从Windows运行时请求一个通知通道。在本示例中，您对URI进行Base64编码，这样您能够在查询字符串中将URI传递给食谱服务。Base64编码不是绝对必要，可是它防止这种可能性，即通道URI可能在查询字符串中包含须要base-64编码的字符。

您正在使用HttpClient(它是.NET框架的一部分,目前Windows运行时不包含对HTTP网络的支持)触发对托管在Windows Azure中的食谱服务的调用并传递通道URI。该服务维护全部订阅服务的客户端(经过URI标识)记录并在20分钟时间内每隔2分钟向这些客户端发送通知。每一个传递给服务的通道URI标识了一个在特定设备上运行的特定应用程序。

任务 3 – 测试推送通知

最后的步骤是确认您的应用程序收到传递给它的推送通知。

一、在调试器中按F5启动应用程序。做为应用程序启动方案的一部分，如今该应用程序重置它的磁贴并订阅推送通知。

二、返回Visual Studio并中止调试以关闭应用程序。

三、转到Windows 8的开始屏幕并找到应用程序的主磁贴。若是它是一个正方形的磁贴，右键单击它并从应用栏选择“放大”以显示一个宽磁贴。

四、观察磁贴一段时间。在2分钟以内，磁贴应该发生改变以显示一些不一样的特点食谱中的一个，如图4所示。

图4 在磁贴更新后Contoso Cookbook的主磁贴

五、等待2分钟后检查并验证磁贴再次被修改。注意即便应用程序未运行，这些也会发生！

注意：若是您想观察锁屏提醒的运行状况，在传递给HttpClient.GetAsync的URI中将“type=tile”修改成“type=badge”。再次运行应用程序，在大约两分钟后，一个数字或“锁屏提醒”将出如今磁贴上。

 

练习 3: 合并计划消息

Toast是在屏幕角落中的小窗口中显示的消息。不管计划Toast的应用程序是否运行，Toast都会出现。Toast能够经过应用程序本身被计划(当应用程序运行时)，或者从Windows通知服务响应通知。此外，Toast能够包含声音和文字。

在本练习中，您将向Contoso Cookbook添加计划toast以对提醒进行模拟。

任务 1 – 修改应用栏

为了提供计划toast的用户界面，咱们须要向应用栏添加一个提醒(Reminder)命令并为它编写处理程序。

一、打开ItemDetailPage.xaml并向<Page.Resources>部分添加如下语句。

XAML

<Style x:Key="ReminderAppBarButtonStyle" TargetType="Button" BasedOn="{StaticResource AppBarButtonStyle}">
    <Setter Property="AutomationProperties.AutomationId" Value="ReminderAppBarButton"/>
    <Setter Property="AutomationProperties.Name" Value="Reminder"/>
    <Setter Property="Content" Value="&#xE121;"/>
</Style>

二、同时在ItemDetailPage.xaml中，向应用栏“LeftCommands”部分的结束处添加如下语句。

XAML 

<Button x:Name="ReminderButton" HorizontalAlignment="Left" Style="{StaticResource ReminderAppBarButtonStyle}" Click="OnReminderButtonClicked" />

三、打开ItemDetailPage.xaml.cs并添加如下using语句。

C# 

using Windows.UI.Notifications;
using Windows.UI.Popups;

四、接着向ItemDetailPage类添加如下方法。

C# 

private async void OnReminderButtonClicked(object sender, RoutedEventArgs e) 
{
    var notifier = ToastNotificationManager.CreateToastNotifier ();

    // 确认通知被启用
    if (notifier.Setting != NotificationSetting.Enabled)
    {
        var dialog = new MessageDialog("Notifications are currently disabled");
        await dialog.ShowAsync();
        return;
    }

    // 获取toast模板并插入包含消息的文本节点
    var template = ToastNotificationManager.GetTemplateContent(ToastTemplateType.ToastText01);
    var element = template.GetElementsByTagName("text")[0];
    element.AppendChild(template.CreateTextNode("Reminder!"));

    // 计划从如今起30秒后显示toast
    var date = DateTimeOffset.Now.AddSeconds(30);
    var stn = new ScheduledToastNotification(template, date);
    notifier.AddToSchedule(stn);
}

五、启动应用程序并点击某个食谱以 转到项-明细页面。

六、确认应用栏包含Reminder命令，如图5所示。

 

图5 Reminder命令

七、返回Visual Studio并中止调试。

 

任务 2 – 启用toast通知

在测试前的最后一个任务是在清单中启用toast通知。

一、打开Package.appxmanifest并转到应用程序UI选项卡。

二、将”支持Toast通知” (” Toast capable”)设置修改成”是”(图6)。

 

图6 启用toast通知

注意：您必须在应用程序能够计划toast前启用支持Toast通知。在启用这个设置后，一个切换按钮将出如今应用程序的权限页面，它容许用户启用或禁用通知。您添加的OnReminderButtonClicked方法检查通知是否被启用，若是通知未被启用将提醒用户。

任务 3 –运行toast!

最后的任务是测试计划toast通知的代码并查看toast的运行。

一、按F5启动应用程序。

二、转到您选择的食谱。

三、显示应用栏并点击Reminder按钮。

四、返回Visual Studio并中止调试。

五、切换到Windows 8开始屏幕或另外一个应用程序，并为toast出现等待大约30秒。

 

 图 7 来自Contoso Cookbook的toast

六、点击toast并验证您将切换回Contoso Cookbook。

七、返回Visual Studio并中止调试。

 

总结

您如今已经查看了辅助磁贴，推送通知和计划toast的运行。这些仅仅是您能够在应用程序未运行时经过磁贴和通知更新内容的一小部分示例。

从咱们在实验1开始Contoso Cookbook以来，咱们已经完成了不少工做，可是还有一些工做须要完成。接下来咱们将继续探索Windows应用商店API并容许用户模拟对应用程序以及额外食谱的购买。微软为应用作了大量推广和收集购买费用的工做，所以经过Windows应用商店应用赚钱很是容易。听起来颇有趣？那么让咱们开始吧。