Anzeigen eines DataSets in Project Siena

 

Zeigen Sie ein DataSet in einem benutzerdefinierten Katalog an, in dem Sie die Daten in aufsteigender oder absteigender Reihenfolge nach einer selbst gewählten Spalte sortieren und nach einem oder mehreren Kriterien filtern können.Zeigen Sie ein DataSet in einem Kreis-, Säulen- oder Liniendiagramm an.

In diesem Thema laden Sie eine oder mehrere komprimierte Dateien herunter und importieren Daten aus jeder Datei in einer Auflistung.Sie können dieselbe Vorgehensweise auf beliebige DataSets anwenden, egal ob Sie diese aus einer externen Quelle hinzufügen, die Daten selbst angeben oder sie vom Benutzer anfordern.

Hier erhalten Sie einen allgemeinen Überblick über Project Siena und Links zu Ressourcen wie Beispiel-Apps, Videolernprogramme und Foren.

Voraussetzungen

  • Erstellen Sie Ihre erste App, um einen Einblick in grundlegende Aufgaben wie das Hinzufügen von Steuerelementen und das Importieren von Daten zu erhalten.

Anzeigen von DataSets in einem benutzerdefinierten Katalog

  1. Laden Sie PriceList.zip herunter, und importieren Sie die Datei in eine Auflistung namens PriceList.

  2. Drücken Sie ALT+V, scrollen Sie nach unten bis Galerien, und klicken Sie dann darauf.

    The icon you click to show a list of types of galleries

  3. Scrollen Sie nach unten bis zum vertikalen benutzerdefinierten Katalog, und klicken Sie dann darauf.

    Symbol für die vertikale benutzerdefinierte Galerie

  4. Legen Sie die Items-Eigenschaft der Auflistung, die Sie gerade hinzugefügt haben, auf PriceList fest, und verschieben Sie sie auf die rechte Seite des "import"-Steuerelements.

  5. Klicken Sie auf das erste Element der Auflistung (die Katalogvorlage), fügen Sie drei Bezeichnungen hinzu, und legen Sie dann die Text-Eigenschaft aller Bezeichnungen auf einen dieser Ausdrücke fest:

    ThisItem!Name

    Text(ThisItem!Price, "$#")

    ThisItem!Maker

    Jedes Element im Katalog gibt den Namen eines Produkts, seinen Hersteller und den Preis an.

    A gallery template with three labels, showing product name, maker, and price

  6. Passen Sie die Größe der Bezeichnungen an, und ordnen Sie sie in einer Zeile im oberen Bereich der Vorlage an. Verkleinern Sie dann die Höhe der Vorlage, damit die Bezeichnungen genauer passen.

    Zum Auswählen der Vorlage klicken Sie unter die Bezeichnungen im ersten Element.

  7. Verringern Sie die Höhe und Breite der Auflistung selbst, um die Artikel genauer einzupassen.

  8. (Optional) Fügen Sie über dem Katalog Bezeichnungen hinzu, um die Spalten zu identifizieren.

    Gallery with three columns: Product name, price, and maker

Sortieren von DataSets

  1. Befolgen Sie die Anweisungen unter Show data in a custom gallery, und legen Sie anschließend die Items-Eigenschaft des Katalogs auf diese Funktion fest:

    Sort(PriceList, Name)

    Der Katalog wird in aufsteigender Reihenfolge nach Produktnamen sortiert.

    A gallery with three columns, sorted alphabetically

  2. Legen Sie die Elemente-Eigenschaft der Galerie auf die folgende Funktion fest:

    Sort(PriceList, Name, Descending)

    Der Katalog wird in absteigender Reihenfolge nach Produktnamen sortiert.

Filtern von DataSets

  1. Führen Sie die Schritte unter Show data in a custom gallery aus.

  2. Fügen Sie einen Schieberegler hinzu, benennen Sie diesen mit PriceFilter, und verschieben Sie ihn in den Katalog.

  3. (Optional) Konfigurieren Sie den Schieberegler so, dass Benutzer nur einen Wert im Bereich der Preise in der Liste festlegen können:

    • Legen Sie die Min-Eigenschaft auf diese Funktion fest:

      Min(PriceList, Price)

    • Legen Sie die Max-Eigenschaft auf diese Funktion fest:

      Max(PriceList, Price)

  4. Legen Sie die Items-Eigenschaft des Katalogs auf den folgenden Ausdruck fest:

    Filter(PriceList, Price<=PriceFilter!Value)

  5. Stellen Sie den Schieberegler auf einen Wert zwischen dem höchsten und dem niedrigsten Preis im Katalog ein.

    Wenn Sie den Schieberegler einstellen, werden im Katalog nur die Produkte angezeigt, die nicht teurer als der festgelegte Wert sind.

    A gallery filtered to show only items that are below a certain price

  6. Fügen Sie ein Eingabetextfeld hinzu, und benennen Sie es mit MakerFilter.

  7. Legen Sie die Elemente-Eigenschaft der Galerie auf die folgende Funktion fest:

    Filter(PriceList, Price<=PriceFilter!Value && MakerFilter!Text in Maker)

  8. Stellen Sie den Schieberegler auf 50 ein, und geben Sie den Buchstaben f im Eingabetextfeld ein.

    Der Katalog zeigt nur Fabrikam-Produkte, die weniger als 50 $ kosten.

    A gallery in which the items are filtered by two criteria

Filtern eines Katalogs anhand eines anderen Katalogs

  1. Laden Sie die Dateien "OEMs.zip" und "Devices.zip" aus der TechNet Gallery herunter.

  2. Importieren Sie die Datei "OEMs.zip" in eine Auflistung namens OEMs, und importieren Sie die Datei "Devices.zip" in eine Auflistung namens Devices.

    Unter Erstellen Ihrer ersten App finden Sie ein Beispiel für das Importieren von Daten in eine Auflistung.

  3. Drücken Sie ALT+V, scrollen Sie nach unten bis Galerien, und klicken Sie dann darauf.

    The icon you click to show a list of types of galleries

  4. Klicken Sie auf die vertikale Bildergalerie, legen Sie die zugehörige Items-Eigenschaft auf OEMs fest, und schieben Sie sie rechts neben die anderen Steuerelemente.

  5. Klicken Sie auf das Bild für das erste Element im Katalog, und legen Sie seine ImagePosition-Eigenschaft auf Fit fest.

  6. Benennen Sie den Katalog mit OEMGallery, und stellen Sie ihn schmaler dar, um mehr Bilder anzuzeigen.

    In einer schmaleren Galerie werden mehr Logos gleichzeitig angezeigt

  7. Fügen Sie eine horizontale Bildergalerie mit Text hinzu, legen Sie die Items-Eigenschaft auf Devices fest, und schieben Sie sie rechts neben den OEMs-Katalog.

  8. (Optional) Vertauschen Sie die Daten, die in den beiden Bezeichnungen innerhalb des Katalogs angezeigt werden, damit der Name jedes Geräts in größeren Buchstaben über den Namen des OEMs angezeigt wird.

    Links: OEM-Galerie, Rechts: Gerätegalerie

  9. Legen Sie die Items-Eigenschaft der Gerätegalerie auf die folgende Funktion fest:

    Filter(Devices, 'OEM name' = OEMGallery!Selected!'OEM name')

    Beim Klicken auf ein Logo in OEMGallery werden in der Gerätegalerie nur die Produkte dieses OEMs angezeigt.

Anzeigen von Daten in einem Diagramm

Ihre Daten sollten mit der Serie in der ersten Zeile und den Beschriftungen in der Spalte ganz links angeordnet sein, wie im folgenden Beispiel dargestellt:

A collection with four columns and three rows

  1. Laden Sie ChartData.zip herunter, und importieren Sie die Datei in eine Auflistung namens ProductRevenue.

  2. Drücken Sie ALT+V, klicken Sie auf Diagramme, und klicken Sie anschließend auf Kreisdiagramm.

  3. Legen Sie die Items-Eigenschaft des Kreisdiagramms auf ProductRevenue fest.

    Das Kreisdiagramm zeigt den relativen Umsatz der Produkte im Jahr 2012.

    A pie chart that shows revenue for three products

  4. Drücken Sie ALT+V, klicken Sie auf Diagramme, und klicken Sie anschließend auf Säulendiagramm.

  5. Legen Sie die Items-Eigenschaft des Säulendiagramms auf ProductRevenue fest.

    Im Säulendiagramm wird der Umsatz für jedes Produkt im Jahr 2012 dargestellt.

    A column chart that shows revenue for three products

  6. Klicken Sie im unteren Bereich des Bildschirms auf Design. Klicken Sie auf das Diagramm, nachdem dieses angezeigt wird, und legen Sie dann die Anzahl der Reihen auf "3" fest.

    Im Säulendiagramm werden die Umsatzdaten für jedes Produkt über einen Zeitraum von drei Jahren dargestellt.

    A column chart that shows revenue data for three products over three years