快速入門:傳送快顯通知 (HTML)
[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App,請參閱 最新文件 ]
注意 不是使用 JavaScript?請參閱快速入門:傳送快顯通知 (XAML)。
快顯通知是顯示在畫面上的快顯 UI,無論使用者是在另一個應用程式、在 [開始] 畫面或是在 Windows 桌面,都能讓應用程式與使用者進行通訊。這個快速入門會逐步引導您定義和顯示快顯通知內容。 這些動作是透過本機通知示範的,而本機通知是實作上最簡單的通知。我們討論以下步驟:
- 指定通知的範本
- 擷取範本的空白 XML 內容
- 新增通知的文字
- 新增通知的影像
- 設定通知的持續時間
- 指定隨附通知的音訊
- 提供通知啟用應用程式時使用的內容相關資訊
- 以本機通知方式傳送快顯通知
注意 在這個快速入門中,您將直接透過 XML 文件物件模型 (DOM) 來操作通知內容。另外還有透過 NotificationsExtensions 程式庫的選擇性方法,這個程式庫會以物件屬性的形式呈現 XML 內容,包含 Intellisense。如需詳細資訊,請參閱快速入門:在程式碼中使用 NotificationsExtensions 程式庫。若要查看這個快速入門中以 NotificationsExtenstions 表示的程式碼,請參閱快顯通知範例。
注意 透過 Microsoft Visual Studio 測試快顯通知程式碼功能時,您必須在 Windows x86、x64 或 Windows 執行階段電腦上,使用本機電腦或遠端電腦偵錯設定。您不能使用 Visual Studio 模擬器偵錯功能選項—您的程式碼將在模擬器中編譯並執行,但不會顯示快顯通知。
先決條件
為了解這個主題,您將需要:
- 快顯通知詞彙及概念的實用知識。如需詳細資訊,請參閱快顯通知概觀。
- 您應用程式資訊清單中的 [支援快顯通知] 選項必須設為 "true" (Visual Studio 資訊清單編輯器中的 [是]),才能傳送或接收快顯通知。如需詳細資訊,請參閱如何選擇加入快顯通知。
- 熟悉 XML 和透過文件物件模型 (DOM) API 操作 XML 的方法。
- 熟悉快顯通知 XML 結構描述。如需詳細資訊,請參閱快顯通知結構描述。
- 能夠使用 Windows 執行階段 API 透過 JavaScript 建立基本 Windows 市集應用程式的能力。如需詳細資訊,請參閱使用 JavaScript 建立您的第一個 Windows 市集應用程式。
指示
1. 選擇性:宣告命名空間變數
這個步驟提供您用來取代完整命名空間名稱的簡短名稱。這是 C# 中的 "using" 陳述式或 Visual Basic 中的 "Imports" 陳述式的對等項。讓您將程式碼簡化。
注意 這個快速入門中的其餘程式碼假設已經宣告這個變數。
var notifications = Windows.UI.Notifications;
2. 為您的快顯通知挑選一個範本,然後抓取它的 XML 內容
從系統提供的範本目錄中選擇一個符合您內容需求的範本。如需範本的完整清單,請參閱 ToastTemplateType 列舉。請注意,您傳送的每個獨立通知都可以使用不同的範本。
注意 Windows Phone 8.1 只支援 toastText02 範本的一種變化。它接受兩個文字字串,其中第一個轉譯為粗體文字,但是兩者皆位於同一行,所以應該只使用一個短字串或兩個極短字串,以避免串連。
與 Windows 搭配使用的這個範例使用 toastImageAndText01 範本,需要一個影像和一個文字字串。以下提供一個範例:
var template = notifications.ToastTemplateType.toastImageAndText01;
var toastXml = notifications.ToastNotificationManager.getTemplateContent(template);
getTemplateContent 方法傳回 XmlDocument。上述程式碼會抓取下列 XML 基本架構,您將在後續的步驟中,透過標準文件物件模型 (DOM) 函式為這個基本架構提供詳細資料:
<toast>
<visual>
<binding template="ToastImageAndText01">
<image id="1" src=""/>
<text id="1"></text>
</binding>
</visual>
</toast>
3. 提供通知的文字內容
這個範例會先抓取標記名稱為 "text" 之範本中的所有元素。toastImageAndText01 範本只包含單一文字字串,程式碼之後會指派這個字串。這個字串最多可換三行,因此應妥善設定字串的長度以避免截斷。
var toastTextElements = toastXml.getElementsByTagName("text");
toastTextElements[0].appendChild(toastXml.createTextNode("Hello World!"));
4. 提供通知的影像
這個程式碼會先抓取標記名稱為 "image" 之範本中的所有元素。快顯通知範本 (例如 toastImageAndText01) 最多包含一個影像。請注意,並非所有快顯通知範本都包含影像;某些只有文字。
var toastImageElements = toastXml.getElementsByTagName("image");
影像的來源可以是應用程式的套件、應用程式的本機存放區或網路。針對每個影像來源,分別顯示了這個步驟的不同版本。影像大小必須小於 200 KB 且小於 1024 x 1024 像素。如需詳細資訊,請參閱磚與快顯通知影像大小。
下列程式碼使用應用程式套件的本機影像。這種影像類型包含於 Visual Studio 方案檔中,而且是封裝為您應用程式的一部分。可使用 "ms-appx:///" 首碼存取這些影像。為呈現最佳做法,我們也會針對協助工具用途 (如螢幕助讀程式) 指派替代文字。
重要 這裡使用的影像 "redWide.png" 只是一個範例,並未包含在 Microsoft Visual Studio 專案中。您必須以新增到專案的實際影像名稱取代 "redWide.png",再嘗試傳送此快顯通知。
toastImageElements[0].setAttribute("src", "ms-appx:///images/redWide.png");
toastImageElements[0].setAttribute("alt", "red graphic");
下列程式碼使用應用程式本機存放區的本機影像。應用程式已將此類型的影像儲存在其本機存放區中。這是由 Windows.Storage.ApplicationData.current.localFolder 傳回的位置。可使用 "ms-appdata:///local/" 首碼存取這些影像。同樣地,我們也會針對協助工具用途 (如螢幕助讀程式) 指派選擇性的替代文字。
toastImageElements[0].setAttribute("src", "ms-appdata:///local/redWide.png");
toastImageElements[0].setAttribute("alt", "red graphic");
下列程式碼使用網頁影像。可使用 "http://" 通訊協定指定影像的路徑,以存取這些影像。您也可以使用 "https://" 通訊協定。
toastImageElements[0].setAttribute("src", "https://www.microsoft.com/redWide.png");
toastImageElements[0].setAttribute("alt", "red graphic");
您可以使用選擇性的 baseUri 屬性來指定根路徑,例如 "https://www.microsoft.com/",其結合了任一影像的 src 屬性中指定的任何相對統一資源識別元 (URI)。這個屬性可以在 visual 元素 (套用至整個通知) 或 binding 元素 (套用至該繫結) 上設定。如果同時在這兩個元素中設定 baseUri,則 binding 中的值會覆寫 visual 中的值。
如果 baseUri 設定為 "https://www.microsoft.com/",範例程式碼中的這一行:
toastImageElements[0].setAttribute("src", "https://www.microsoft.com/redWide.png");
便可縮短成這樣:
toastImageElements[0].setAttribute("src", "redWide.png");
5. 選用:指定快顯通知持續時間
您可以選擇性設定快顯通知的顯示持續時間。有兩個值:"short" (預設值) 和 "long"。只有在您的通知屬於來電或約會提醒等案例時,才能使用 "long"。如需詳細資訊,請參閱快顯通知概觀。
注意 Windows Phone 8.1 不支援不同的持續時間,所有快顯通知的持續時間都相同。如果手機快顯通知中包含此屬性,會被忽略。
注意 預設持續時間為 "short",因此通常只在要將持續時間設定成 "long",才會新增這個屬性。
var toastNode = toastXml.selectSingleNode("/toast");
toastNode.setAttribute("duration", "long");
6. 選用:指定快顯通知音效
如需快顯通知音效的詳細資訊,請參閱快顯通知音訊選項目錄。
根據預設,Windows 會在顯示快顯通知時播放簡短的音效。您可以選擇從系統提供的一組音效中指定不同音效,或是不播放音效。在 Windows Phone 8.1 上,您可以指定自訂音效。如需詳細資訊,請參閱快顯通知音訊選項目錄。
透過 getTemplateContent 抓取的範本不包含 audio 元素,所以您必須予以定義並新增到 XML 承載。指定音效檔時,是透過使用 "ms-winsoundevent:" 前置詞來指定,如果是在 Windows Phone 8.1 上,則是以使用 "ms-appx:///" 或 "ms-appdata:///" 前置詞的路徑來指定。這個範例會建立 audio 元素,並選取 toast 元素成為它的父元素。
var toastNode = toastXml.selectSingleNode("/toast");
var audio = toastXml.createElement("audio");
這個範例會指定非預設音效。
audio.setAttribute("src", "ms-winsoundevent:Notification.IM");
這個範例會指定不播放音效。
audio.setAttribute("silent", "true");
如果是持續時間較長的快顯通知,您可以循環播放音效,而非只播放一次。請注意,循環播放音效只適用於持續時間較長的快顯通知。系統指定的一組音效中,包含適合循環播放的特定音效。這個範例會指定循環播放音效。
注意 因為它不支援持續時間較長的快顯通知,所以 Windows Phone 8.1 不支援循環播放音效。
toastNode.setAttribute("duration", "long");
var audio = toastXml.createElement("audio");
audio.setAttribute("src", "ms-winsoundevent:Notification.Looping.Alarm");
audio.setAttribute("loop", "true");
一旦定義了音效元素,您就必須將它附加到快顯通知的 XML 承載,做為 toast 元素的子元素,如下所示。
toastNode.appendChild(audio);
7. 指定應用程式啟動參數
當使用者按一下您的快顯通知時,預期會啟動您的應用程式,並顯示關於通知內容的檢視。為了達到這個目的,會使用快顯通知元素的 launch 屬性,它會提供一個字串,在透過快顯通知啟動應用程式時,會將這個字串從快顯通知傳送到應用程式。這個字串沒有特定形式,而且是由應用程式定義。每次啟動應用程式時,應用程式必須檢查這個字串並將它做為引數,然後據此調整它的檢視或作業。
toastXml.selectSingleNode("/toast").setAttribute("launch", '{"type":"toast","param1":"12345","param2":"67890"}');
注意 在 Windows Phone Silverlight 8.1 中,啟動字串值的值會附加到您的預設啟動頁面 URI。例如,如果您提供啟動字串 "?conversation=71",它會產生像是 /MainPage.xaml?conversation=71 的 URI。因此,啟動字串必須同時也是有效的查詢字串;否則,就會擲回例外狀況。
8. 根據您已指定的 XML 內容來建立快顯通知。
var toast = new notifications.ToastNotification(toastXml);
9. 傳送您的快顯通知。
var toastNotifier = notifications.ToastNotificationManager.createToastNotifier();
toastNotifier.show(toast);
注意 在 Windows Phone Silverlight 8.1 中,如果目前的前景應用程式是 ToastNotifier.Show 方法的呼叫端,就不會顯示快線通知。在這種情況下,快顯通知應該主要由背景代理程式使用。
附註: 套用至快顯通知的背景色彩,是在應用程式資訊清單中為應用程式磚宣告的背景色彩。如需詳細資訊,請參閱快速入門:使用 Visual Studio 資訊清單編輯器建立預設磚。
摘要與後續步驟
在這個快速入門中,您已將本機快顯通知傳送給使用者。
這個快速入門以本機通知方式 (最容易實作的通知類型) 傳送快顯通知,讓您能夠迅速看到結果。您應該接著探索其他快顯通知傳遞方法:排程及推播。如需詳細資訊,請參閱傳遞通知。
相關主題
範例
概念
教學
如何透過 AppUserModelID 啟用桌面快顯通知功能
最佳做法
參考