Communardo Software GmbH, Kleiststraße 10 a, D-01129 Dresden

Rational Application Developer 8

IBM hat im Dezember 2011 die Version 8.0.4 des Rational® Application Developer für WebSphere® ver­öf­fent­licht. Die Unterstützung der Entwicklung mit Dojo für mobile Endgeräte hat sich durch einige Erweiterungen wie „Mobile Web Browser Simulator“, zahl­rei­che CSS Templates oder „Rich Page Editor“, die sich zum Teil noch im Beta Status befin­den, ver­bes­sert. Ich zeige kurz, wie man sehr ein­fach Pages für unter­schied­li­che mobile Endgeräte erstel­len kann.

Im ers­ten Schritt legt man ein dojo Web Project an.

1. Erzeugen eines neuen Static Web Projektes:
New > Static Web Project > Name eingeben

2. Anschließend das Dojo Toolkit hin­zu­fü­gen. Modify… > Web 2.0 / Dojo Toolkit hin­zu­fü­gen. "Change these setup opti­ons" wäh­len, dort "Copy Dojo into this pro­ject" und das Dojo Toolkit SDK 1.7 Alpha aus­wäh­len, dadurch wer­den alle für mobile Pages benö­tig­ten Sourcen dem Projekt hinzugefügt.

3. Danach sollte man eine JavaScript Datei anle­gen, die dann in die sta­ti­schen Pages ein­ge­bun­den wer­den kann.

4. Anschließend wird die eigent­li­che Web Page ange­legt. New > Web Page > Als Template „Mobile HTML/XHTML“ wäh­len und unter "Options" das eben ange­legte JavaScript zuord­nen, das dann als Source ein­ge­bun­den wird.

Anlegen einer „Detect“ Page
Durch die Option „Detect device“, die stan­dard­mä­ßig aus­ge­wählt ist, wird per Javascript der Mobile Client auto­ma­tisch erkannt und die ent­spre­chende CSS gela­den. Für unter­schied­li­che Clients muss dann jeweils eine eigene Page ange­legt wer­den und ein Style Template aus "dojo.mobile.stylesheet" zuge­ord­net wer­den. Dojo bie­tet eine Reihe an fer­ti­gen Templates für ver­schie­dene mobile Endgeräte wie z.B. iPhone, Blackberry oder Android an.

Zur Bearbeitung bie­tet die Entwicklungsumgebung einen Editor zur Erstellung von Benutzeroberflächen an (Rich Page Editor Beta). Der Editor bie­tet vor­ge­fer­tigte Code-Schnipsel, die in die eigene Page per Drag and Drop gezo­gen und dort wei­ter bear­bei­tet wer­den kön­nen. Anschaulich wird dies im Video von Scott Paxton auf Youtube demonstriert.

[youtube]http://www.youtube.com/watch?v=zWCeZVWQcbY[/youtube]

Das Ergebnis kann im "Mobile Web Browser Simulator" geprüft werden.

23. Januar 2012
|

Related Posts

Pin It on Pinterest