我們開發的應用在Win8 界面中會以磁貼形式展現,預設情況下磁貼會顯示應用圖示,即項目工程中的Logo.png圖檔檔案。開發人員可按應用的需要使用通知的方式将文字或圖檔資訊推送到磁貼,進而對磁貼中顯示的内容進行更換。
screenshot_11172012_175541
對于磁貼通知推送主要用到API 是Windows.UI.Notifications,API 中提供了很多磁貼顯示模版TileTemplateType,模版的結構是通過XML 描述的。其實我們需要做的就是編輯模版中的内容,然後将它推送到磁貼。有些童鞋可能發現下面代碼中定義了兩個模版:TileWideImageAndText01 和TileSquareText04。這是由于Win8 應用有大小兩種尺寸的磁貼,在應用推送通知時無法知道目前磁貼的大小,如果推送的模版内容與磁貼尺寸不符,在顯示方面可能會産生問題,是以官方建議将兩種尺寸得模版全部定義好,這樣無論磁貼處于哪種尺寸都不會發生顯示問題。
<tile>
<visual>
<binding template="TileWideImageAndText01">
<image src="ms-appx:///Assets/Wide.png"/>
<text>This is a wide tile notification!</text>
</binding>
<binding template="TileSquareText04">
<text>This is a square tile notification!</text>
</visual>
</tile>
接下來我們需要做的就是編輯模版内容(如下代碼),先用TileUpdateManager 類的GetTemplateContent 方法定義大尺寸磁貼模版,示例中TileWideImageAndText01 是帶有圖檔和文字的大尺寸模版,TileTemplateType 枚舉還包含其他類型的模版,開發者可自行選取使用。後續使用标準BOM 編輯模版的<text> 和<image> 标簽設定相應的數值和屬性。
同樣,編輯完小尺寸磁貼後,将其加載到大尺寸模版<visual>(如上XML)。通過TileNotification 建立一個磁貼通知,可使用ExpirationTime 設定磁貼通知消失時間。最後,使用TileUpdateManager.CreateTileUpdaterForApplication().Update() 推送通知,可使用Clear() 清除磁貼通知。
// For wide tile
XmlDocument wideTile = TileUpdateManager.GetTemplateContent(TileTemplateType.TileWideImageAndText01);
XmlNodeList wdTxtAttribute = wideTile.GetElementsByTagName("text");
XmlNodeList wdImgAttribute = wideTile.GetElementsByTagName("image");
((XmlElement)wdImgAttribute[0]).SetAttribute("src", "ms-appx:///Assets/Wide.png");
wdTxtAttribute[0].InnerText = "This is a wide tile notification!";
// For square tile
XmlDocument sqTile = TileUpdateManager.GetTemplateContent(TileTemplateType.TileSquareText04);
XmlNodeList sqTxtAttribute = sqTile.GetElementsByTagName("text");
sqTxtAttribute[0].InnerText = "This is a square tile notification!";
IXmlNode node = wideTile.ImportNode(sqTile.GetElementsByTagName("binding").Item(0), true);
wideTile.GetElementsByTagName("visual").Item(0).AppendChild(node);
TileNotification tileNotification = new TileNotification(wideTile);
tileNotification.ExpirationTime = DateTimeOffset.UtcNow.AddSeconds(10);
TileUpdateManager.CreateTileUpdaterForApplication().Update(tileNotification);
圖示
image
源碼下載下傳
http://sdrv.ms/WhVSLU
本文轉自Gnie部落格園部落格,原文連結http://www.cnblogs.com/gnielee/archive/2012/11/17/windows8-app-develop-tiles.html如需轉載請自行聯系原作者