快速构建Windows 8风格应用31-构建磁贴

原文:快速构建Windows 8风格应用31-构建磁贴

引言

磁贴是吸引用户经常使用应用重要手段之一。我们可将应用程序内较好的内容使用磁贴进行展示。

另外应用程序磁贴是应用程序中的核心部分,而且很可能也是用户最常见到的部分,因此利用动态磁贴来吸引用户经常使用我们的应用程序!

本篇博文主要介绍如何创建基本磁贴(也就是默认磁贴)以及如何使用本地通知更新磁贴。

一、创建基本磁贴

基本磁贴也可以叫做默认磁贴。通常我们点击基本磁贴来启动或者切换应用。

我们可以在应用程序清单文件中设置默认的静态磁贴,并且该静态磁贴分为两种大小:

注意:这两种大小的磁贴都可以被动态更新。那么我们怎么创建应用中的基本磁贴呢?

1.创建Windows 8 商店应用程序;

2.打开应用清单文件(package.appxmanifest),选择“应用程序 UI”窗口;

3.

  • 使用自己的徽标图像路径取代默认的图像;
  • 设置磁贴上显示应用的短名称。注意:该名称不能超过 13 个字符。如果名称太长,将会被截断。当然我们可以选择显示徽标,显示名称或两者都不显示;
  • 选择名称的文本是使用浅色字体还是深色字体(基于背景色);
  • 也可设置背景色,该背景色用于对应用的其他部分进行着色,例如:任意应用中对话框的按钮颜色,以及 Windows 应用商店中的“应用详情”页等;

到此为止,我们设置的基本磁贴已经完成,当然我们也可以设置宽徽标、小徽标、应用商店徽标等徽标。

二、本地通知更新磁贴

其实更新磁贴的方式总共有四种(可参考选择通知传递方式),应用程序可使用本地通知来更新其磁贴,这对于正在运行的应用程序且信息发生变更的情形十分有效。

应用程序可在精确的时间点安排磁贴和 Toast 更新。另外应用程序可在未运行时通过云端进行更新磁贴。

那么我们使用本地通知更新磁贴呢?

1.添加命名空间

   1:  using Windows.UI.Notifications;
   2:  using Windows.Data.Xml.Dom;

其中Windows.UI.Notifications 包含磁贴 API。

2.选取模版并查看XML内容

我们可以使用系统提供的模版TileTemplateType,选择一个适合应用程序的模版。这里以TileWideImageAndText01 模板为例,该模版中需要一个图像和一个文本字符串。

   1:  XmlDocument tileXml = TileUpdateManager.GetTemplateContent(TileTemplateType.TileWideImageAndText01);

其中GetTemplateContent 方法检索一个 XmlDocument,该XML框架如下:

<tile>
    <visual>
        <binding template="TileWideImageAndText01">
            <image id="1" src=""/>
            <text id="1"></text>
        </binding>
    </visual>
</tile>

3.提供相关文本内容

   1:  XmlNodeList tileTextAttributes = tileXml.GetElementsByTagName("text");
   2:   tileTextAttributes[0].InnerText = "你好!测试磁贴更新~";

我们首先需要检索模板中标记名称为“text”的所有元素。TileWideImageAndText01 模板仅包含单个文本字符串,代码接着将分配该字符串。

注意:字符串中最多可以在两行内自动换行,因此应该相应地设置字符串的长度以避免截断。

4.提供图像

我们首先需要检索模板中标记名称为“image”的所有元素。TileWideImageAndText01 模板中包含单个图像。

注意:并非所有磁贴模板都包含图像,某些磁贴模板是仅文本的。

   1:  XmlNodeList tileImageAttributes = tileXml.GetElementsByTagName("image");

这里我们可以从应用的程序包中本地图像、应用的本地存储或者Web中获取图像。

注意:在包含多个图像的磁贴通知中,图像可以使用这些图像的任意组合,同时模版中图片大小必须小于200KB,像素小于1024*768。(可参考:磁贴和 Toast 图像大小

  • 使用应用程序包中本地图像:
   1:   ((XmlElement)tileImageAttributes[0]).SetAttribute("src", "ms-appx:///Assets/WideLogo.png");
   2:   ((XmlElement)tileImageAttributes[0]).SetAttribute("alt", "red graphic");
  • 使用应用的本地存储图像:
   1:  ((XmlElement)tileImageAttributes[0]).SetAttribute("src", "ms-appdata:///local/redWide.png");
   2:  ((XmlElement)tileImageAttributes[0]).SetAttribute("alt", "red graphic");
  • 使用Web中图像:
   1:  ((XmlElement)tileImageAttributes[0]).SetAttribute("src", "http://www.contoso.com/redWide.png");
   2:  ((XmlElement)tileImageAttributes[0]).SetAttribute("alt", "red graphic");

5.包含一个方形和宽版通知

首先我们在发送通知时,是无法知道当前应用程序的磁贴的状态是方形还是宽版。因此我们在更新通知时同时包括方形和宽版是最佳做法。

使用在宽版通知中使用的文本字符串定义了一个仅文本方形通知:

   1:  XmlDocument squareTileXml = TileUpdateManager.GetTemplateContent(TileTemplateType.TileSquareText04);
   2:  XmlNodeList squareTileTextAttributes = squareTileXml.GetElementsByTagName("text");
   3:  squareTileTextAttributes[0].AppendChild(squareTileXml.CreateTextNode("Hello World! My very own tile notification"));

然后我们向宽版磁贴的负载添加方形磁贴。检索在方形 TileXml 负载中定义方形磁贴的 binding 元素。作为宽版磁贴的同级附加该 binding 元素。

   1:  IXmlNode node = tileXml.ImportNode(squareTileXml.GetElementsByTagName("binding").Item(0), true);
   2:  tileXml.GetElementsByTagName("visual").Item(0).AppendChild(node);

6.创建通知

   1:  TileNotification tileNotification = new TileNotification(tileXml);

7.设置通知到期日期

默认情况下,本地磁贴和锁屏提醒不会过期,但是推送通知、定期通知、激活通知会在三天之后过期。通常我们会设置一个合理的过期时间。

注意:磁贴内容的保留时间应不长于内容具有相关性的时间。

   1:  tileNotification.ExpirationTime = DateTimeOffset.UtcNow.AddSeconds(10);

8.发送通知

   1:  TileUpdateManager.CreateTileUpdaterForApplication().Update(tileNotification);

9.清除磁贴通知

如果我们设置了通知过期时间,就不需要显示调用清除通知的方法。

   1:  Windows.UI.Notifications.TileUpdateManager.CreateTileUpdaterForApplication().Clear();

注意:我们不能通过云清除通知。

虽然在本地调用 Clear 方法会清除磁贴而不考虑其通知的来源,但是定期通知或推送通知只能将磁贴更新为新内容。

最后实现效果:

  • 方形通知:

  • 宽版通知:

更多关于磁贴介绍可参考:

  1. 打造卓越的磁贴体验(第 1 部分)
  2. 打造卓越的磁贴体验(第 2 部分)
  3. App tiles and badges sample
时间: 2024-08-01 22:53:52

快速构建Windows 8风格应用31-构建磁贴的相关文章

快速构建Windows 8风格应用13-SearchContract构建

原文:快速构建Windows 8风格应用13-SearchContract构建 本篇博文主要介绍如何在应用中构建SearchContract,相应的原理已经在博文<快速构建Windows 8风格应用12-SearchContract概述及原理>中阐述清楚. 如何在应用中构建SearchContract 这里以常见的构建Search Contract功能为例,具体如下: 设置应用Search权限: 我们在应用中构建SearchContract之前,需要确认应用程序具有相应的Search能力,可以

快速构建Windows 8风格应用15-ShareContract构建

原文:快速构建Windows 8风格应用15-ShareContract构建 本篇博文主要介绍共享数据包.如何构建共享源.如何构建共享目标.DataTransferManager类. 共享数据包 DataPackage(数据包)是共享数据标准. 共享数据格式可以是多种的,包括文本.URI.HTML.图像等,以及更多可扩展的格式. 我们可以通过以下方法设置需要的分享数据类型: 1)  SetText():设置共享文本,例如: 可以实现效果: 2)  SetUri():设置共享Uri; 3)  Se

快速构建Windows 8风格应用32-构建辅助磁贴

原文:快速构建Windows 8风格应用32-构建辅助磁贴 引言 Windows Phone中,我们开发者可能会开发的一个功能点是将数据列表中某一项"Pin To Start(固定到开始屏幕)",大家都知道这种固定到开始屏幕的磁贴叫做辅助磁贴(也叫二级磁贴),用户可以通过该辅助磁贴启动应用程序并导航到应用程序中某一个页面或某一位置. 其实Windows 8 Store风格应用程序也引入了辅助磁贴的概念,用户在使用Windows 8 Store应用的辅助磁贴和Windows Phone

快速构建Windows 8风格应用35-触控输入

原文:快速构建Windows 8风格应用35-触控输入 引用 Windows 8设备通常具有多点触摸屏,用户可以同时使用多个手指来进行不同的输入交互,如点击.拖动或收缩等手势操作.另外Windows 8中将触摸.鼠标和笔/触笔交互是作为指针输入进行接收.处理和管理. 一.手势处理 首先我们来汇总一下Windows 8中常用的手势都有哪些. 1,点击:用一个手指触摸屏幕,然后抬起手指. 2,长按:用一个手指触摸屏幕并保持不动. 3,滑动:用一个或多个手指触摸屏幕并向着同一方向移动. 4,轻扫:用一

快速构建Windows 8风格应用22-MessageDialog

原文:快速构建Windows 8风格应用22-MessageDialog 本篇博文主要介绍MessageDialog概述.MessageDialog常用属性和方法.如何构建MessageDialog   MessageDialog概述 MessageDialog指的就是对话框. 对话框的命令栏中最多包含三个命令.如果我们指定任何命令,将会有一个默认命令添加到对话框中,目的是关闭对话框. 对话框弹出后界面中所有元素将在对话框下面显示,并且将会阻塞任何触摸事件直到用户进行响应对话框. 另外对话框应该

快速构建Windows 8风格应用36-商店应用发布流程

原文:快速构建Windows 8风格应用36-商店应用发布流程 引言 在发布应用之前,我们需要注册开发者账号才能够发布应用.我们可以登录https://appdev.microsoft.com/StorePortals/ 该网址进行注册开发者账号,同时我们也可以点击这里来浏览MSDN给到的开发者账号注册的详细步骤.那么注册完成开发者账号后,如何发布Windows Store 应用程序呢? Windows Store App 发布流程 1,使用Visual Studio 2012打开要上传的应用,

快速构建Windows 8风格应用23-App Bar概述及使用规范

原文:快速构建Windows 8风格应用23-App Bar概述及使用规范 本篇博文主要介绍App Bar概述.App Bar命令组织步骤.App Bar最佳实践.   App Bar概述 Windows 8 Store应用中的App Bar(应用程序工具栏)起到的作用和Windows Phone中AppBar一样.我们可以向用户提供各种操作接口,实现导航或者触发命令等. AppBar一般默认是隐藏的,也可以设置为始终可见.我们可以通过清扫屏幕上边缘或下边缘时显示AppBar,AppBar被点击

快速构建Windows 8风格应用26-本地应用数据

原文:快速构建Windows 8风格应用26-本地应用数据 本篇博文主要介绍如何获取应用的设置和文件容器.如何将数据写入设置.如何从设置中获取数据.如何删除设置中数据.如何将数据写入文件.如何从文件中获取数据. 当应用安装时,系统会为设置和文件等应用数据提供它自己的每用户数据存储.我们不需要知道这些数据存在哪里或如何存储,因为系统会负责管理物理存储工作.我们只需使用应用数据API就可以了. 本地应用数据一般用于当前设备数据的持久化,并且本地数据没有限制大小,通常情况使用本地数据存储大型数据集.

快速构建Windows 8风格应用2-创建调试应用

原文:快速构建Windows 8风格应用2-创建调试应用 本篇博文主要介绍的是创建应用时可以选择哪些模版,生成默认的Windows 8风格应用解决方案中含哪些文件,最后是如何调试Windows 8风格应用. 我们如何使用Visual Studio 2012创建Windows 8风格应用呢?可归结为以下几步: 1.选择我们要使用的开发语言,例如:JavaScript.C++.C#.Visual Basic. 2.选择项目模版,可以选择以下常用的项目模版: 1)拆分应用(Split App)模版 可