-
磁貼
鎖定
美國 微軟公司2012年將發佈的 操作系統 Windows 8，全新Modern開始界面下的那些方格，英文是Tile，中文之前有騷人墨客稱之為 瓷磚，還有人叫它板磚。
- 中文名
- 磁貼
- 外文名
- Tile
- 公 司
- 微軟公司
- 操作系統
- Windows、Windows Phone
- 發佈時間
- 2012年
- 發佈國家
- 美國
磁貼創建默認
磁貼説明
Modern界面下的windows8的“色塊”磁貼
1. 創建新項目。 打開 Visual Studio Express 2012 RC for Windows 8。
單擊“新建項目...”
如果還未打開，請單擊“新建項目”窗口左側面板中的“已安裝”。
選擇項目語言。
選擇“Windows Modern 風格”。
在“新建項目”窗口的中心窗格中，選擇“空白應用程序”。
在窗口底部為項目指定一個名稱。
單擊“確定”。
2. 打開清單編輯器 如果未顯示“解決方案資源管理器”，請從“視圖”菜單中進行選擇。
雙擊“Package.appxmanifest”。此時會打開“清單編輯器”窗口。
3. 提供磁貼詳細信息 如果還未打開，請選擇清單編輯器的“應用程序 UI”窗格。
使用你自己的徽標圖像的路徑取代默認的圖像。
選擇是否在磁貼上顯示應用的短名稱。此名稱不能超過 13 個字符。如果名稱太長，將會被截斷。你可以選擇顯示徽標，顯示名稱或兩者都不顯示。
選擇名稱的文本是使用淺色字體還是深色字體（基於背景色）。
接受默認背景色，或以 W3DC 顏色字符串（如“#FFFFFF”）提供自己的顏色。此背景色用於對應用的其他部分進行着色：任意應用中對話框的按鈕顏色，以及 Windows 應用商店中的“應用詳情”頁。
磁貼目標
若要使用已安裝的模板在 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 像素。 注意 如果未提供加寬圖像，則除非發佈你的應用的新版本，否則無法通過加寬模板更新磁貼。但是，磁貼顯示為正方形磁貼還是加寬磁貼由用户決定。有關何時應該包括以及何時不應包括加寬圖像的詳細信息，請參閲磁貼指南和清單。
磁貼發送更新
磁貼先決條件
本主題假設你瞭解磁貼和通知術語及概念，以及 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 方法都會清除磁貼而不要加快通知的來源，但是，為了通過定期或推送通知清除磁貼中的通知，你應該發送一個新通知以替換當前內容。
