Anbindung einer CellTable-Komponente an einen JPA-Service

Zellbiologie: GWT CellTable

Oliver Heger

Entwickler von Web-Applikationen stehen häufig vor der Aufgabe, dem Benutzer umfangreiche Listen von Daten zu präsentieren. Neuere Versionen des Google Web Toolkits bieten zu diesem Zweck sogenannte Cell Widgets an. In diesem Artikel wollen wir die mächtige CellTable-Komponente unter die Lupe nehmen und zeigen, wie eine Symbiose mit einem JPA-basierten Service, der auf der Google App Engine (GAE) läuft, erzielt werden kann.

Das Google Web Toolkit (GWT) bietet ein Programmiermodell für Web-Applikationen, das eher an Desktop-Bibliotheken wie Swing oder SWT angelehnt ist und den Entwickler vor ungeliebten Details wie JavaScript und Browser-Kompatibilität abschirmt. Auch im Bereich der Darstellung umfangreicher tabellarischer Daten hat die Bibliothek einiges zu bieten. Neben einfachen aber limitierten Komponenten wie FlexTable verfügen die neueren Cell-Komponenten über weitreichende Funktionalitäten. Die GWT-Dokumentation preist sie als „hoch-effizient“ und „leichtgewichtig“ an [1]. Was steckt hinter dieser Aussage?

DNA – Grundlagen

Cell Widgets verwalten selbst keine Daten, sondern arbeiten zu diesem Zweck eng mit einem Data Provider zusammen. Sie kennen lediglich die Anzahl der darzustellenden Elemente sowie den sichtbaren Bereich. Ändert sich dieser – beispielsweise durch eine Benutzer-Interaktion -, erhält der Data Provider eine Benachrichtigung. Er muss der Komponente dann zumindest die aktuell sichtbaren Daten zur Verfügung stellen, etwa indem er einen Service aufruft. Eine entsprechende Implementierung des Data Providers vorausgesetzt, ist die Übertragung großer Datenmengen bei diesem Ansatz nicht notwendig. Stattdessen fordert der Provider wiederholt Portionen von Daten an – eben genau das, was der Benutzer sehen möchte.

Der Begriff „Cell Widget“ rührt daher, dass die Komponenten mit sogenannten Cell-Objekten verbunden sind. Eine Cell ist in der Lage, Daten eines bestimmten Typs anzuzeigen und gegebenenfalls auch zu ändern. Kenner der JTable-Komponente aus der Swing-Bibliothek können hier eine Analogie zu Cell-Renderer bzw. -Editor-Komponenten ziehen. GWT stellt bereits eine umfangreiche Auswahl konkreter Cell-Implementierungen für unterschiedliche Datentypen zur Verfügung, z.B.:

  • (Editierbare und nicht editierbare) Texte
  • Buttons zur Auslösung bestimmter Aktionen
  • Checkboxen zur Darstellung boolescher Werte
  • Icons und Bilder
  • Datumswerte mit komfortabler Eingabemöglichkeit

CellTable gehört zu der Gruppe der Cell Widgets. Sie ermöglicht die Anzeige von Daten in unterschiedlichen Spalten und eignet sich daher hervorragend für die Präsentation komplexerer Ergebnisse von Service-Aufrufen. Die zu verwaltenden Spalten werden der Komponente nach ihrer Erzeugung hinzugefügt. Jede Spalte wird dabei mit einer Cell verknüpft, die ihrem Datentyp entspricht. Wir werden uns im Folgenden anhand eines Beispiels die nötigen Schritte für den Einsatz einer CellTable anschauen.

Membran – Benutzeroberfläche

Die Beispielapplikation erlaubt den Benutzern die Verwaltung ihrer persönlichen Musik-Sammlung. Eine Ansicht präsentiert eine Liste mit allen gespeicherten Songs (Abb. 1). Ein Song wird dabei durch die einfache Bean-Klasse SongInfo repräsentiert, die auszugsweise in Listing 1 zu sehen ist. Die Seite mit der Song-Übersicht besteht im Wesentlichen aus einer CellTable mit Spalten, die den Eigenschaften dieser Klasse entsprechen.

Abb. 1: Eine CellTable zur Anzeige von SongsAbb. 1: Oberfläche der Beispielanwendung (Vergrößern)

Listing 1
public class SongInfo implements Serializable {
private String songID;
private Date creationDate;
private String name;
private Long duration;
private Integer inceptionYear;
private String artistName;
private String albumName;
private Integer trackNo;
private int playCount;

// get and set methods omitted
}
Geschrieben von
Oliver Heger
Kommentare

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.