Einbauen von Live Tiles mit lokalen Notifications in einer Windows Store App

Von Rina+Ahmed Autor Feed 15. April 2013 09:39

Live Tiles geben Euch die Möglichkeit, die Benutzer in Eure App immer wieder hineinzuziehen. Ich will Euch heute zeigen, wie man ohne viel Code auf die Schnelle eine Live Tile in eine Windows Store einbaut, indem man lokale Updates an die Kachel schickt.

Wir wollen das ganze an einem RSS Reader Framework demonstrieren. Wir haben für dieses Beispiel das RSS Reader Framework von atwork gewählt.

image

Nachdem ihr das Framework heruntergeladen und entpackt habt, öffnet bitte die FeedReaderApp.sln Datei. Sofern Ihr Visual Studio auf dem Rechner installiert habt (hier findet Ihr Visual Studio Express für Windows 8), sollte jetzt die Solution in Visual Studio geöffnet werden.

 

1.) Wir klicken jetzt rechts im Solution Explorer auf den Ordner Common mit der rechten Maustaste und fügen ein neues Item hinzu.

AddNewItem

Dann wählen wir die Kategorie Class und nennen unsere Klasse LiveTileManager.cs .

image

 

2.) Die LiveTileManager Klasse wird nun für uns geöffnet und wir sehen bereits den Code für die Grundstruktur der Klasse. Wir löschen den gesamten Code und ersetzen ihn mit folgendem Code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Windows.Data.Xml.Dom;
using Windows.UI.Notifications;
 
namespace FeedReaderApp.Common
{
    class LiveTileManager
    {
        
        public static void SetLiveTile(TileTemplateType tileTemplateType, int seconds, int tag,
                                        Action<XmlDocument> customizeMethod)
        {
            // Get tile template. 
            var tileTemplate = tileTemplateType;
            var tileXml = TileUpdateManager.GetTemplateContent(tileTemplate);
            // Create notification. 
            var notification = new TileNotification(tileXml);
            notification.ExpirationTime = DateTime.Now + TimeSpan.FromSeconds(seconds);
            notification.Tag = "Title " + tag;
            // Set notification options. 
            customizeMethod(tileXml);
            // Update Live Tile. 
            var upd = TileUpdateManager.CreateTileUpdaterForApplication();
            upd.Update(notification);
        }
 
    }
}

Wir haben uns hier eine Hilfsklasse für die Live Tiles erstellt. Die Methode SetLiveTile ist zuständig dafür, die Kachel mit den Updates zu aktualisieren.

Sie holt sich zunächst den XML Content vom Tile Template, den wir als Parameter mitgeben. Dann wird eine Notification erstellt. Wir setzen durch den mitgegebenen Parameter die Expiration Time der Notification. Das ist die Dauer, für die der Update in der Live Tile angezeigt wird. Danach setzen wir einen Tag an der Notification. Der Tag identifiziert die Notification und ist deswegen nötig, weil wir mehr als eine Notification an die Live Tile schicken und diese dann reihenweise durchlaufen werden. Es können maximal 5 Notifications durchlaufen werden. Danach rufen wir die customize Methode auf, die ein Delegate ist und in der wir den Inhalt des XML Codes für die Notification festlegen. Das sehen wir bei der Definition noch genauer.

Schließlich erstellen wir uns TileUpdater Objekt und rufen die Update Methode mit unserer erstellten Notification auf. Somit wird die Kachel aktualisiert.

 

3.) Nun müssen wir diese Methode aufrufen und den Content für die Updates liefern. Wir öffnen die Datei GroupedItemsViewModel.cs, die sich im Ordner ViewModel im Solution Explorer befindet.

Wir fügen nun in der Klasse eine weitere Methode namens UpdateLiveTile() mit folgendem Code hinzu:

        public void UpdateLiveTile()
        {
            for (int i = 0; i < Math.Min(_feedItems.Count, 5); i++)
            {
                LiveTileManager.SetLiveTile(TileTemplateType.TileSquareText02,
                60*60*24,i,
                (XmlDocument tileXml) =>
                {
                    var nodes = tileXml.GetElementsByTagName("text");                    
                    nodes[0].AppendChild(tileXml.CreateTextNode(_feedItems[i].FeedName));
                    nodes[1].AppendChild(tileXml.CreateTextNode(_feedItems[i].Title));
                });
            }
        }

Wir haben hier eine Schleife, die für jedes FeedItem, maximal aber 5 Mal, die SetLiveTile Methode unseres LiveTileManagers aufruft. Wir wählen für unsere Live Tile die TileSquareText02 Vorlage. Als Expiration Time geben wir die Dauer von 24 Stunden in Form von Sekunden an. Der aktuelle Wert des Schleifendurchlaufs bildet unsere Tagzahl. Letztendlich passen wir noch den XML Content unseres TileTemplates an, in dem wir die zwei Textelemente der Vorlage auf den Namen des Blogs und den Titel des Posts setzen.

 

4.) Letztendlich müssen wir noch diese UpdateLiveTile() Methode aufrufen. Wir suchen uns die Property FeedsGroupedBySource und fügen direkt oberhalb des return Statements den Aufruf für die UpdateLiveTile() Methode ein. Das Ganze sieht dann so aus:

        public List<FeedGrouping> FeedsGroupedBySource
        {
            get
            {
                if (_feedItems == null) return null;
 
                var query = from item in _feedItems                            
                            group item by item.FeedName                            
                            into g
                            select new FeedGrouping()
                                       {
                                           Name = g.Key,
                                           FeedItems = g.Take(5).ToList()
                                       };
                UpdateLiveTile();
                return query.ToList();
            }
        }

 

Jedes Mal, wenn ihr nun eure App startet, wird die Live Tile mit 5 Blogposts aktualisiert. Wie ihr seht, habt ihr mit wenigen Codezeilen eine Live Tile in Eure App eingebaut.

Pingbacks and trackbacks (1)+

Add comment

  Country flag

biuquote
  • Comment
  • Preview
Loading

Datenschutzhinweis: Sie stimmen durch "Kommentar speichern" der Speicherung Ihrer Angaben durch Microsoft Österreich für die Beantwortung der Anfrage zu. Sie erhalten dadurch keine unerwünschten Werbezusendungen. Ihre Emailadresse wird auf Ihren Wunsch dazu verwendet Sie über neue Kommentare zu informieren.

Microsoft respektiert den Datenschutz. Datenschutz & Cookies


 
    Build2016
    Developer Events

Aktuelle Downloads

Azure Free Trial
 
Visual Studio Downloads
 
Windows Azure Free Trial
Instagram
CodeFest.at on Facebook

Datenschutz & Cookies · Nutzungsbedingungen · Impressum · Markenzeichen
© 2013 Microsoft. Alle Rechte vorbehalten · BlogEngine.NET 2.7.0.0 · Diese Website wird für Microsoft von atwork gehostet.
powered by atwork