磁贴

美国微软公司2012年将发布的作业系统 Windows 8，全新Modern开始界面下的那些方格，英文是Tile，中文之前有骚人墨客称之为瓷砖，还有人叫它板砖。

基本介绍

中文名：磁贴
外文名：Tile
国家：美国
公司：微软公司
时间：2012年
作业系统：Windows、Windows Phone

定义

美国微软公司2012年将发布的作业系统Windows 8，全新Modern开始界面下的那些方格，英文是Tile，中文之前有骚人墨客称之为瓷砖，还有人叫它板砖。

创建默认

说明

使用 Microsoft Visual Studio 11 清单编辑器创建默认磁贴（使用 JavaScript 和 HTML 的 Modern 风格套用）

目标

若要使用已安装的模板在 Visual Studio Express 2012 RC for Windows 8 中创建新项目，则需在包清单中定义默认的磁贴及其图像。

先决条件　Visual Studio Express 2012 RC for Windows 8

显示在磁贴上的图像档案，150 x 150 像素。

该图像档案的较小版本，30 x 30 像素。此图像不用于磁贴本身，而是在搜寻结果、“所有程式”列表以及 UI 的其他位置中使用。

推荐：该图像档案的加宽版本为 310 x 150 像素。注意如果未提供加宽图像，则除非发布你的套用的新版本，否则无法通过加宽模板更新磁贴。但是，磁贴显示为正方形磁贴还是加宽磁贴由用户决定。有关何时应该包括以及何时不应包括加宽图像的详细信息，请参阅磁贴指南和清单。

说明

1. 创建新项目。打开 Visual Studio Express 2012 RC for Windows 8。

单击“新建项目...”

如果还未打开，请单击“新建项目”视窗左侧面板中的“已安装”。

选择项目语言。

选择“Windows Modern 风格”。

在“新建项目”视窗的中心窗格中，选择“空白应用程式”。

在视窗底部为项目指定一个名称。

单击“确定”。

2. 打开清单编辑器如果未显示“解决方案资源管理器”，请从“视图”选单中进行选择。

双击“Package.appxmanifest”。此时会打开“清单编辑器”视窗。

3. 提供磁贴详细信息如果还未打开，请选择清单编辑器的“应用程式 UI”窗格。

使用你自己的徽标图像的路逕取代默认的图像。

选择是否在磁贴上显示套用的短名称。此名称不能超过 13 个字元。如果名称太长，将会被截断。你可以选择显示徽标，显示名称或两者都不显示。

选择名称的文本是使用浅色字型还是深色字型（基于背景色）。

接受默认背景色，或以 W3DC 颜色字元串（如“#FFFFFF”）提供自己的颜色。此背景色用于对套用的其他部分进行着色：任意套用中对话框的按钮颜色，以及 Windows 套用商店中的“套用详情”页。

传送更新

先决条件

本主题假设你了解磁贴和通知术语及概念，以及 XML。还假设你知道如何使用 Windows 运行时 API 创建採用 JavaScript 的基本的 Modern 风格套用。

若要使此页上显示的示例代码正常工作，则必须在档案中包含以下行：

var Notifications = Windows.UI.Notifications;

说明

为磁贴选择一个模板并获取它的 XML 内容 var tileXml = Notifications.TileUpdateManager.getTemplateContent(Notifications.TileTemplateType.tileWideText03);

有关完整的模板列表，请参阅 TileTemplateType。

通过文档对象模型 (DOM) 方法提供模板内容此示例使用 TileWideText03 模板，该模板包含一个可包含三行自动换行的文本字元串，如下所示：

var tileAttributes = tileXml.getElementsByTagName("text"); tileAttributes[0].appendChild(tileXml.createTextNode("Hello World! My very own tile notification"));

基于已经指定的 XML 内容创建通知

var tileNotification = new Notifications.TileNotification(tileXml);

为通知设定到期时间该通知将在十分钟内到期并从磁贴中删除。

var currentTime = new Date(); tileNotification.expirationTime = new Date(currentTime.getTime() + 600 * 1000);

向套用磁贴传送通知。

Notifications.TileUpdateManager.createTileUpdaterForApplication().update(tileNotification);

指定磁贴

贴

先决条件

了解磁贴和通知术语及概念。有关详细信息，请参阅磁贴、锁屏提醒以及通知。

使用 Windows 运行时 API 创建採用 JavaScript 的基本 Modern 风格套用的功能。

若要使此页上显示的示例代码正常工作，则必须在档案中包含以下行：

var Notifications = Windows.UI.Notifications;

说明

步骤 1: 定义加宽磁贴此示例选择模板，检索模板文本和图像元素，以及为这些元素分配值。

var tileXml = Notifications.TileUpdateManager.getTemplateContent(Notifications.TileTemplateType.tileWideImageAndText01); // Get the text attributes for this template and fill them in.var tileTextAttributes = tileXml.getElementsByTagName("text"); tileTextAttributes[0].appendChild(tileXml.createTextNode("This tile notification uses ms-resource images")); // Get the image attributes for this template and fill them in.var tileImageAttributes = tileXml.getElementsByTagName("image"); tileImageAttributes[0].setAttribute("src", "ms-resource:images/redWide.png");

步骤 2: 定义正方形磁贴此示例重複执行仅图像正方形磁贴的前面步骤。

var squareTileXml = Notifications.TileUpdateManager.getTemplateContent(Notifications.TileTemplateType.tileSquareImage); var squareTileImageAttributes = squareTileXml.getElementsByTagName("image"); squareTileImageAttributes[0].setAttribute("src", "ms-resource:images/graySquare.png");

步骤 3: 向宽磁贴的负载添加正方形磁贴此示例检索 binding 元素，该元素定义 squareTileXml 负载中的正方形磁贴并导入该元素以及将其作为加宽磁贴的同级追加。

var node = tileXml.importNode(squareTileXml.getElementsByTagName("binding").item(0), true); tileXml.getElementsByTagName("visual").item(0).appendChild(node);

备注

前面的步骤在 XML 负载的一个 visual 元素下添加了两个 binding 元素，结果如下所示：

<tile> <visual lang="en-US> <bindingtemplate="TileSquareImage"><imageid="1"src="ms-appx:///images/graySquare.png"/></binding><bindingtemplate="TileWideImageAndText01"><imageid="1"src="ms-appx:///images/redWide.png"/><textid="1">This tile notification uses ms-resource images</text></binding></visual></tile>

通知方法

说明

步骤 1: 设定选项以启用通知循环此代码为你的套用启用通知伫列。运行套用时，仅需要发起此调用一次，因此应在初始化代码中发起此次调用。

Windows.UI.Notifications.TileUpdateManager.createTileUpdaterForApplication().enableNotificationQueue(true);

步骤 2: 创建磁贴通知这是所有磁贴通知中的第一步且这种情形与其他任何情形没有区别，此处包含该步骤仅用于完整性。有关详细信息，请参阅快速入门：传送磁贴更新。

var template = Windows.UI.Notifications.TileTemplateType.tileWideText03; var tileXml = Windows.UI.Notifications.TileUpdateManager.getTemplateContent(template); // TODO: Fill in the template with your tile content.// TODO: Define a square tile and add it to tileXML.var tileNotification = new Windows.UI.Notifications.TileNotification(tileXml);

步骤 3: 授予通知标记此步骤可选。标记为不超过 16 个字元的字元串加上终止 NULL 字元，用于唯一标识套用中的通知。

tileNotification.tag = "stock.msft";

步骤 4: 向磁贴传送通知

Windows.UI.Notifications.TileUpdateManager.createTileUpdaterForApplication().update(tileNotification);

清除方法

说明

步骤 1: 清除通知并还原为默认磁贴。此行代码从套用的磁贴中清除当前通知。

Windows.UI.Notifications.TileUpdateManager.createTileUpdaterForApplication().clear();

备注

对于启用通知伫列且在伫列中有通知的磁贴，调用 clear 方法清空伫列。

请注意，不能通过云清除通知。儘管本地调用 clear 方法都会清除磁贴而不要加快通知的来源，但是，为了通过定期或推送通知清除磁贴中的通知，你应该传送一个新通知以替换当前内容。

点击展开全文

转载请注明出处海之美文 » 磁贴

磁贴

基本介绍

定义

创建默认

说明

目标

说明

传送更新

先决条件

说明

指定磁贴

说明

备注

通知方法

清除方法

说明

备注

相关推荐