Schnellstart: Verwenden der NotificationsExtensions-Bibliothek im Code (HTML)

  • Artikel

[ Dieser Artikel richtet sich an Windows 8.x- und Windows Phone 8.x-Entwickler, die Windows-Runtime-Apps schreiben. Wenn Sie für Windows 10 entwickeln, finden Sie weitere Informationen unter neueste Dokumentation]

Hinweis  Sie verwenden nicht JavaScript? Weitere Informationen finden Sie unter Schnellstart: Verwenden der NotificationsExtensions-Bibliothek im Code (XAML).

 

Mithilfe der NotificationsExtensions-Objektmodellbibliothek können Sie den Inhalt von XML-Vorlagen für Popupbenachrichtigungen, Kacheln und Signale angeben, ohne das XML-Dokumentobjektmodell (DOM) verwenden zu müssen. Dies ist eine einfachere, eindeutigere und direktere Methode zum Bereitstellen von Benachrichtigungsinhalt. Die Verwendung dieser Bibliothek in Microsoft Visual Studio bietet Ihnen folgende Vorteile:

  • IntelliSense listet die verfügbaren Tags und Attribute als Objekteigenschaften auf und muss daher nicht auf die Schemadokumentation für Elemente und Strukturen zurückgreifen.
  • Über die Factoryfunktion können Sie Skelettbenachrichtigungen erstellen und dann mit Ihrem Inhalt füllen.
  • Dies ist eine Möglichkeit, mehrere Kachelgrößen leichter in die Benachrichtigungsnutzlast einzubinden (bewährte Methode!).
  • Text- und Bildattribute können leichter gefunden und eingegeben werden: Die Namen der Attribute liefern mehr Informationen zu ihrer beabsichtigten Verwendung, Größe oder Position in der Vorlage.

Hinweis  Die NotificationsExtensions-Bibliothek wird mit einer Microsoft Limited Public License (MS-LPL) lizenziert. Sie können die Bibliothek in Ihrer Windows Store-App oder in Ihrem Webdienst wieder verwenden und bei Bedarf für Ihre App anpassen.

 

Voraussetzungen

  • Grundkenntnisse der Begriffe und Konzepte für Kacheln und Benachrichtigungen. Weitere Informationen finden Sie unter Kacheln, Signale und Benachrichtigungen.
  • Kenntnisse zum Erstellen einer einfachen Windows Store-App mit JavaScript mithilfe von Windows-Runtime-APIs. Weitere Informationen finden Sie unter Erstellen Ihrer ersten Windows Store-App mit JavaScript.
  • Wenn Sie über grundlegende XML-Kenntnisse verfügen erhalten Sie eine bessere Vorstellung der Art der mit der NotificationsExtensions-Bibliothek erstellten Inhalte.

Anweisungen

1. Abrufen der NotificationsExtensions-Bibliothek

Die NotificationsExtensions-Bibliothek ist in mehreren Kachel-, Popup- und Benachrichtigungsbeispielen enthalten, die Sie herunterladen und zur Verwendung in Ihrer App kopieren können. In diesem Verfahren wird das grundlegende Beispiel für Kacheln und Signale verwendet.

Hinweis  Bei NotificationsExtensions handelt es sich um eine C#-Bibliothek, die aber auch in JavaScript-, C#-, C++- und Microsoft Visual Basic-Projekte eingebunden und dafür verwendet werden kann.

 

  1. Laden Sie das Beispiel für App-Kacheln und Signale aus dem Windows Dev Center herunter.
  2. Entzippen Sie die Datei "App tiles and badges sample.zip" in einen Ordner Ihrer Wahl.
  3. Greifen Sie auf den Ordner zu, in den Sie das Beispiel entzippt haben. Kopieren Sie den Ordner "NotificationsExtensions" aus dem Beispiel in Ihr eigenes Projekt, und zwar als gleichgeordnetes Element der SLN-Datei Ihres Projekts.

2. Hinzufügen der Bibliothek im Projekt

  1. Starten Sie Visual Studio, und öffnen Sie Ihr Projekt.
  2. Klicken Sie im Projektexplorer mit der rechten Maustaste auf die Projektmappe, die sich in der Verzeichnisstruktur an der obersten Position befindet.
  3. Wählen Sie Hinzufügen und dann Vorhandenes Projekt.
  4. Navigieren Sie zum Ordner "NotificationsExtensions" in Ihrem Projekt, und wählen Sie die Datei "NotificationsExtensions.csproj" aus.
  5. Klicken Sie in allen Projekten Ihrer Projektmappe jeweils mit der rechten Maustaste auf Verweise, und wählen Sie Verweis hinzufügen.
  6. Wählen Sie im Verweis-Manager unter Projektmappe den Eintrag "NotificationsExtensions" aus, und klicken Sie auf OK. NotificationsExtensions ist jetzt bereit für die Verwendung.

Hinweis  Falls Sie nicht das gesamte NotificationsExtensions-Projekt in Ihre Projektmappe einbinden möchten, können Sie NotificationsExtensions als eigenständiges Projekt erstellen und einfach "NotificationsExtensions.winmd" als Verweis in Ihr Projekt einfügen.

 

3. Hinzufügen der Bibliothek auf dem App-Server

Sie können das NotificationsExtensions-Objekt auch in Ihrem App-Servercode verwenden, wenn Sie mit ASP.NET Pushbenachrichtigungen an Windows-Pushbenachrichtigungsdienste (Windows Push Notification Services, WNS) senden oder einen ASP.NET-Dienst zum Behandeln von Anforderungen für regelmäßige Kachel- oder Signalaktualisierungen implementieren. Dazu müssen Sie allerdings das Buildsymbol für die WINRT_NOT_PRESENT-Kompilierung in den NotificationsExtensions-Projekteigenschaften hinzufügen.

  1. Gehen Sie zu dem Verzeichnis, in dem Sie das Beispiel entzippt haben. Öffnen Sie den Beispielordner, und kopieren Sie den Ordner "NotificationsExtensions" an einen neuen Speicherort Ihrer Wahl.

  2. Wählen Sie die Datei "NotificationsExtensions.csproj" aus, um das Projekt in Visual Studio zu öffnen.

  3. Klicken Sie im Menü Projekt auf NotificationsExtensions-Eigenschaften.

  4. Ändern Sie die Auswahl Ausgabetyp in "Klassenbibliothek", um eine DLL-Datei zu erstellen.

  5. Wählen Sie in den NotificationsExtensions-Eigenschaften als Nächstes die Registerkarte Erstellen.

  6. Fügen Sie in der Kategorie Allgemein im Feld Symbole für bedingte Kompilierung den Eintrag "WINRT_NOT_PRESENT" hinzu. Wenn das Feld bereits andere Symbole enthält, fügen Sie vor "WINRT_NOT_PRESENT" ein Semikolon als Trennzeichen ein.

  7. Drücken Sie F7, oder erstellen Sie das Beispiel mit Erstellen > Projektmappe erstellen.

  8. Kopieren Sie die erstellte Datei "NotificationsExtensions.dll" aus dem Ordner (unter "\NotificationsExtensions\bin\Debug\") in Ihren App-Servercode.

4. Verwenden der Bibliothek im Code

NotificationsExtensions kann jetzt als Objekt in Ihrem Code verwendet werden. Die Bibliothek enthält drei wichtige Member:

  • BadgeContent
  • TileContent
  • ToastContent

Jeder dieser Inhaltstypen enthält wiederum Member, die die Elemente und Attribute des jeweiligen Typs darstellen.

Im folgenden Beispiel wird einem numerischen Signal mit NotificationsExtensions ein Wert zugewiesen, und anschließend wird das Signal an die Kachel gesendet.


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

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

Zum Vergleich enthält dieses Beispiel auch das entsprechende Verfahren ohne NotificationsExtensions und mit Verwendung der direkten Bearbeitung des XML-DOM.


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);

Im nächsten Beispiel wird NotificationsExtensions zum Bereitstellen von Text in einer Kachelbenachrichtigung verwendet. Im ersten Schritt wird die TileContentFactory-Funktion von NotificationsExtensions zum Erstellen eines Objekts anhand einer bestimmten Vorlage verwendet. Für jede Vorlage ist eine separate create-Funktion vorhanden. Fügen Sie einfach das Wort "create" an den Vorlagennamen an, z. B. "createTileWide310x150ImageAndText01".

Das vorlagenbasierte Objekt stellt dann IntelliSense bereit, um die verfügbaren Elemente der Vorlage anzuzeigen. Dies sind Eigenschaften, die gemäß ihrer Funktion benannt sind, z. B. textHeading, textBodyWrap, textBody1 oder textColumn1Row4. Dadurch wissen Sie immer genau, welches Element Sie zuweisen.

Nachdem Sie den Eigenschaften Werte zugewiesen haben, können Sie die Kachelbenachrichtigung wie gewohnt senden.


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);

In diesem Beispiel werden einer Benachrichtigung mit NotificationsExtensions Text und ein Bild hinzugefügt. Bildelemente werden analog zu Text als Eigenschaften angezeigt, die nach ihrer jeweiligen Funktion benannt sind, z. B. imageMain oder 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";

In diesem Beispiel wird NotificationsExtensions zum Definieren einer vollständigen Kachelbenachrichtigung verwendet. Dies verdeutlicht eine Besonderheit dieser Bibliothek: Es ist nicht egal, in welcher Reihenfolge Sie der Nutzlast Vorlagengrößen hinzufügen.

  • Eine kleine Vorlage (square71x71 – nur Windows Phone 8.1) kann nur einer mittelgroßen Vorlage hinzugefügt werden.
  • Eine mittelgroße Vorlage (square150x150) kann nur einer breiten Vorlage hinzugefügt werden.
  • Eine breite Vorlage kann nur einer großen Vorlage (square310x310 – nur Windows) hinzugefügt werden.

Wenn Sie versuchen, eine andere Reihenfolge zu verwenden, werden Sie feststellen, dass die benötigten Eigenschaften nicht verfügbar sind.


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);

In diesem Beispiel wird NotificationsExtensions verwendet, um Inhalte für eine Popupbenachrichtigung mit Text, Bild, Audio, Dauer und Startparametern bereitzustellen.


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);

Zusammenfassung

In diesem Thema wurde gezeigt, wie Sie das Erstellen von Signal-, Kachel- und Popupbenachrichtigungen mit NotificationsExtensions vereinfachen können. Diese Vorgehensweise zum Füllen von Vorlagen ist unkomplizierter als das direkte Bearbeiten des XML-DOM.