Süßer als vom verbotenen Baum?

10 Tipps für Windows Phone Mango Tipp 3 Lange Listen und Gruppierung wie im Adressbuch
Kommentare

Einst galt sie als Speise der Götter – „Mangifera indica“ so der lateinische Name der Frucht, die namensgebend für die neueste Version von Windows Phone ist. In dieser Artikelserie erfahren Sie Tipps und Tricks, die die Entwicklung Ihrer Windows-Phone-7.5-Applikation erleichtern sollen. Beginnen wollen wir mit dem Bauen von Standort-abhängigen Anwendungen.

Wie werden lange Listen in einer Applikation am effektivsten dargestellt? Ein gutes Beispiel dafür bietet das eingebaute Adressbuch von Windows Phone oder das neue Startmenü von Mango. Durch die Untergliederung in Gruppen – in den beiden Fällen nach Anfangsbuchstaben – ist ein Auffinden leichter möglich. Drücken die BenutzerInnen auf die Überschrift der Gruppe, so erscheint ein Gruppenmenü, über das rasch zu einer anderen Gruppe gesprungen werden kann (Abb. 1). Wie können Sie nun so eine gruppierte Liste in Ihrer eigenen Applikation umsetzen? Das Silverlight Toolkit auf Codeplex [1] enthält ein LongListSelector Control, das Abhilfe schafft. Abbildung 1 zeigt die unterschiedlichen Bereiche der Liste, die Sie über eine Reihe von Templates entsprechend anpassen können:

Abb. 1: Lange Liste mit Gruppierung und Gruppenmenü
Abb. 1: Lange Liste mit Gruppierung und Gruppenmenü
  • Kopfzeile und Fußzeile (in Grün – 1) wird über das ListHeader- und ListFooter-Template definiert.
  • Das GroupHeader-Template (in Blau – 2) ist die Überschrift jeder einzelnen Gruppe.
  • Das ItemTemplate (in Gelb – 3) rendert die einzelnen Elemente der Gruppe.
  • GroupItem-Template (in Weiß – 4) und GroupItemsPanel steuern die Überblicksdarstellung aller Gruppen.

Damit Sie den LongListSelector einsetzen können, müssen Sie eine eigene Group-Klasse bauen, die die Überschrift sowie die einzelnen Elemente der Gruppe enthält. Den kompletten Code dafür, sowie die Beispiele für alle Templates, finden Sie unter [2].

Fazit: Große Datenmengen können Sie mittels des LongListSelector Controls im Silverlight Toolkit effektiv und nach Gruppen sortiert darstellen.

DI Max Knor ist Technologieberater für Softwareentwicklung. Er betreut als Technical Global Alliance Manager bei Microsoft Corp. eine Hand voll internationaler ISVs im Bereich Retail-Software. Max hält Vorlesungen zu Cloud Computing, Softwarearchitekturen und Webentwicklung an zwei Fachhochschulen.
Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -