Language: HTML | XAML

快速入門:在程式碼中使用 NotificationsExtensions 程式庫 (HTML)

Applies to Windows and Windows Phone

附註  不是使用 JavaScript?請參閱快速入門:在程式碼中使用 NotificationsExtensions 程式庫 (XAML)

您可以使用 NotificationsExtensions 物件模型程式庫提供磚、徽章以及快顯通知 XML 範本內容,而不需使用 XML 文件物件模型 (DOM)。這樣您就能夠以更簡單、更清晰且更直接的方式提供通知內容。 在 Microsoft Visual Studio 使用這個程式庫會得到下列好處:

  • IntelliSense 會將可用的標籤與屬性列為物件屬性,不需要查閱元素與結構的結構描述文件
  • 可用來建立基本架構通知並讓您在稍後填入內容的 Factory 函式。
  • 以簡單的方法將多種磚大小同時加入通知承載 (最佳做法)。
  • 尋找和填入文字與影像屬性的好用方法,為您提供這些屬性的更多資訊,例如範本的使用目的、大小或位置。

附註  NotificationsExtensions 程式庫受 Microsoft 有限公用授權 (MS-LPL) 條款所規範。您可以在 Windows 市集應用程式或 Web 服務中重複使用該程式庫,並視需要針對您的應用程式予以自訂。

先決條件

指示

1. 取得 NotificationsExtensions 程式庫

有好幾個可下載的磚、快顯通知及通知範例都包含 NotificationsExtensions 程式庫,您可予以複製供您自己使用。我們會在這個程序中使用主要磚和徽章範例。

附註  NotificationsExtensions 是一個 C# 程式庫,不過它可以納入 JavaScript、C#、C++ 及 Microsoft Visual Basic 專案並搭配使用。

  1. 從 Windows 開發人員中心下載應用程式磚和徽章範例
  2. 將 "App tiles and badges sample.zip" 檔案解壓縮到您選擇的資料夾。
  3. 移至先前範例解壓縮的目標資料夾。將 NotificationsExtensions 資料夾從範例複製到您自己的專案目錄,成為專案的 .sln 檔案的同層級資料夾。

2. 讓您的專案包含該程式庫

  1. 啟動 Visual Studio,並開啟您的專案。
  2. 在 [專案總管] 中,用滑鼠右鍵按一下樹狀目錄頂端的方案。
  3. 選取 [加入],然後選取 [現有專案]
  4. 瀏覽到專案中的 NotificationsExtensions 資料夾,然後選取 NotificationsExtensions.csproj 檔案。
  5. 在方案內的每個專案中,用滑鼠右鍵按一下 [參考],然後選取 [加入參考]
  6. 在 [參考管理員] 中,選取 [方案] 下的 NotificationsExtensions,然後按一下 [確定]。此時,NotificationsExtensions 已可供使用。

附註  如果您不想將整個 NotificationsExtensions 專案納入您的方案,則可將 NotificationsExtensions 建置成獨立專案,然後在您的專案中僅包含 NotificationsExtensions.winmd 當成參考。

3. 讓您的應用程式伺服器包含該程式庫

如果使用 ASP.NET 將推播通知傳送到 Windows 推播通知服務 (WNS),或是如果您實作 ASP.NET 服務來處理定期磚或徽章更新的要求,則您也可以在應用程式伺服器程式碼中使用 NotificationsExtensions。唯一的缺點是必須在 NotificationsExtensions 專案屬性中加入 WINRT_NOT_PRESENT 編譯建置符號。

  1. 移至先前範例解壓縮的目標目錄。開啟範例資料夾,然後將 NotificationsExtensions 資料夾複製到您選擇的新位置。
  2. 選取 NotificationsExtensions.csproj 檔案,在 Visual Studio 中開啟專案。
  3. 在 [專案] 功能表中,選擇 [NotificationsExtensions 屬性]
  4. 將 [輸出類型] 選項變更為「類別庫」以建置 DLL 檔案。
  5. 另外,在 NotificationsExtensions 屬性中,選取 [建置] 索引標籤。
  6. 在 [一般] 類別底下,於 [條件式編譯的符號] 方塊中加入 "WINRT_NOT_PRESENT"。如果這個方塊已經包含其他符號,請在 "WINRT_NOT_PRESENT" 前面加上分號做為分隔符號。

  7. 按 F7 或使用 [建置] > [建置方案] 來建置專案。
  8. 將已建置的 NotificationsExtensions.dll 檔案從資料夾 (在 \NotificationsExtensions\bin\Debug\ 下) 複製到您的應用程式伺服器程式碼。

4. 在您的程式碼中使用該程式庫

現在您可以在程式碼中,將 NotificationsExtensions 當成物件使用。它包含三個值得注意的成員:

  • BadgeContent
  • TileContent
  • ToastContent

每個內容類型又會包含代表每個類型元素與屬性的成員。

下列範例使用 NotificationsExtensions 將值指派給數字徽章,然後再將它傳送給磚。



var badgeContent = NotificationsExtensions.BadgeContent.BadgeNumericNotificationContent(85);
var badgeNotification = badgeContent.createNotification();

Windows.UI.Notifications.BadgeUpdateManager.createBadgeUpdaterForApplication().update(badgeNotification);

為了進行比較,下列範例顯示直接使用 XML DOM (不含 NotificationsExtensions) 的同一個程序。



var notifications = Windows.UI.Notifications;                        
var badgeXml = notifications.BadgeUpdateManager.getTemplateContent(notifications.BadgeTemplateType.badgeNumber);
var badgeAttributes = badgeXml.getElementsByTagName("badge");
badgeAttributes[0].setAttribute("value", "85");
var badgeNotification = new notifications.BadgeNotification(badgeXml);

BadgeUpdateManager.createBadgeUpdaterForApplication().update(badgeNotification);

下一個範例使用 NotificationsExtensions 提供磚通知中的文字。第一個步驟使用 NotificationsExtensions TileContentFactory 函式,根據特定範本建立物件。每個範本都有不同的 create 函式;只要將 "create" 字詞附加到範本名稱即可,例如 "createTileWide310x150ImageAndText01"。

然後範本型物件就會提供 IntelliSense,以顯示該範本中根據其功能而命名之屬性的可用元素,例如 textHeading、textBodyWrap、textBody1 或 textColumn1Row4。這樣您就能夠明確得知您正在指派哪一個元素。

將值指派給屬性之後,就可以透過正常方式傳送磚通知。



var tileContent = NotificationsExtensions.TileContent.TileContentFactory.createTileSquare150x150Text01();

tileContent.textHeading.text = "Hello!";
tileContent.textBody1.text = "One";
tileContent.textBody2.text = "Two";
tileContent.textBody3.text = "Three";

var tileNotification = tileContent.createNotification();

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

這個範例使用 NotificationsExtentions 將文字和影像指派給通知。影像元素和文字一樣,其屬性是根據它們在範本中的功能來命名,例如 imageMain 和 imageSmallColumn2Row2。



var tileContent = NotificationsExtensions.TileContent.TileContentFactory.createTileWide310x150ImageAndText01();

tileContent.textCaptionWrap.text = "This tile notification uses ms-appx images";

tileContent.image.src = "ms-appx:///images/redWide.png";
tileContent.image.alt = "A red rectangle";

這個範例使用 NotificationsExtensions 定義完整的磚通知。這說明此程式庫的特性之一 — 將範本大小新增到承載時的順序有其重要性。

  • 小型範本 (正方形 71x71 — 僅限 Windows Phone 8.1) 只能新增到中型範本。
  • 中型範本 (正方形 150x150) 只能新增到寬形範本。
  • 寬形範本只能新增到大型 (正方形 310x310 — 僅限 Windows) 範本。

如果您嘗試使用不同順序,會發現無法使用必要的屬性。



var tileLargeContent = NotificationsExtensions.TileContent.TileContentFactory.createTileSquare310x310Text09();
tileLargeContent.textHeadingWrap.text = "Lorem ipsum dolor sit amet, consectetur";
tileLargeContent.textHeading1.text = "Lorem ipsumo";
tileLargeContent.textHeading2.text = "Lorem ipsumo";
tileLargeContent.textBody1.text = "VivAmus tincidunt convallis urn";
tileLargeContent.textBody2.text = "VivAmus tincidunt convallis urn";

var tileWideContent = NotificationsExtensions.TileContent.TileContentFactory.createTileWide310x150Text04();
tileWideContent.textBodyWrap.text = "Lorem ipsum dolor sit amet, consectetur";

var tileMediumContent = NotificationsExtensions.TileContent.TileContentFactory.createTileSquare150x150Block();
tileMediumContent.textBlock.text = "24";
tileMediumContent.textSubBlock.text = "Aliquam";
        
tileWideContent.square150x150Content = tileMediumContent;
tileLargeContent.wide310x150Content = tileWideContent;

var tileNotification = tileLargeContent.createNotification();

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

這個範例使用 NotificationsExtensions 提供快顯通知的內容,包括文字、影像、音訊、持續時間及啟動參數。



var toastContent = NotificationsExtensions.ToastContent.ToastContentFactory.createToastImageAndText01();

toastContent.textBodyWrap.text = "Lorem ipsum dolor sit amet";

toastContent.image.src = "ms-appx:///images/redWide.png";
toastContent.image.alt = "A red rectangle";

toastContent.audio.content = NotificationsExtensions.ToastContent.ToastAudioContent.loopingAlarm;
toastContent.audio.loop = true;

toastContent.duration = NotificationsExtensions.ToastContent.ToastDuration.long;

toastContent.launch = '{"type":"toast","param1":"12345","param2":"67890"}';

var toast = toastContent.createNotification();
Windows.UI.Notifications.ToastNotificationManager.createToastNotifier().show(toast);

摘要

這個主題已經示範如何使用 NotificationsExtensions 簡化徽章、磚以及快顯通知的建立程序。這是填入範本最直接的方法,比直接使用 XML DOM 更方便。

 

 

顯示:
© 2014 Microsoft