Seminar Internetdienste Web 2.0 und Rich Internet Applications (RIA) 14.02.2008 JavaFX Rainer Scholz

Seminar InternetdiensteWeb 2.0 und Rich Internet Applications (RIA)

14.02.2008

JavaFXRainer Scholz

Agenda

Rich Internet Applications

JavaFX Script und -Mobile

Grundlegende JavaFX Script Syntax

Erstellung von GUIs mit JavaFX

Rich Internet Applications

Mischung aus Web- und DesktopanwendungenTeile der Programmlogik auf Client-Seite verlagert

Laufen innerhalb eines Web-BrowsersBerechnungen können auf Client-Seite ausgeführt werden

Wohl bekanntestes Beispiel: Google Maps

Vor- und Nachteile von RIAs

Vorteile:BenutzerfreundlichKeine Installation notwendigKönnen auch „offline“ arbeitenWeniger Belastung von Netzwerken und Server

Nachteile:Längerer DownloadHöhere Anforderung an den ClientrechnerClientrechner muss die Umgebung installiert haben

Agenda

Rich Internet Applications

JavaFX Script und -Mobile

Grundlegende JavaFX Script Syntax

Erstellung von GUIs mit JavaFX

JavaFX Skript

Nach Microsofts Silverlight weiterer Konkurrent für FlashOberfläche basiert auf SwingJava-Klassen und Java-Objekte werden beim Schreiben der Anwendungen mitbenutztWird von Sun als OpenSource bereitgestellt

ZIEL: möglichst schnell und problemlos grafische Oberflächen erstellen

SavaJe

Betriebssystem, basierend auf Java TechnologieSollte Alternative zu Symbian und Windows Mobile werden

Endete jedoch in finanziellem DebakelAufkauf des Projekts durch SunBildet heute Grundlage zu JavaFX Mobile

JavaFX Mobile

Speziell entwickelt für MobilfunkgeräteBetriebssystem basierend auf LinuxDas erste in der „JavaFX“ – Reihe von Multimedia-Applikationen JavaFX Skript folgte in dieser Reihe danach

Soll den Massenmarkt erobern und Unternehmen sowie Entwickler überzeugen

Agenda

Rich Internet Applications

JavaFX Script und -Mobile

Grundlegende JavaFX Script Syntax

Erstellung von GUIs mit JavaFX

Syntax von JavaFX (1)

Deklaration von Variablen:

var s: String;var b: Boolean;

erinnert stark an Pascal-Syntax

Syntax von JavaFX (1)

Deklaration von Variablen:

var s: String;var b: Boolean;

erinnert stark an Pascal-Syntax

Definition von Klassen:class Example {

attribute names: String*;attribute active: Boolean;operation setActive();

}

Auch dies erinnert an Objektdefinitionen in Pascal.Verwendung von regulären Ausdrücken

Syntax von JavaFX (2)

if- und while-Schleifen exakt wie in Javafor-Schleifen lassen nur Listenelemente als Laufvariablen zu

for (i in [0..9]) { ... }

Syntax von JavaFX (2)

if- und while-Schleifen exakt wie in Javafor-Schleifen lassen nur Listenelemente als Laufvariablen zu

for (i in [0..9]) { ... }

Erzeugen eines Objekts:var ex = Example {

namen : [“Hans“, “Anton“]active : true

};

Hier Ähnlichkeit zur Objekt-Erzeugung in Perl erkennbar

Syntax von JavaFX (3)

TriggerÜberwachen Aktionen an Objekten (entsprechen also AWT-Event-Listenern)Sind direkt an das Objekt gebunden (mittels this kann auf das Objekt zugegriffen werden)

Verschiedene Arten:Creation TriggerInsert TriggerDelete TriggerReplace Trigger

Syntax von JavaFX (4)

Beispiel für einen Replace-Trigger:trigger on Example.names[oldValue] = value { System.out.println ("Set Value to {value}");}var ex = Example { names : ["Ich", "er"]};ex.names[1] = "du";

Erzeugt die Bildschirmausgabe

Set Value to du

Agenda

Rich Internet Applications

JavaFX Script und -Mobile

Grundlegende JavaFX Script Syntax

Erstellung von GUIs mit JavaFX

GUIs mit JavaFX

Basieren auf dem Konzept von Java-Swing

Sämtliche Layout-Manager sind in JavaFX Script enthaltenEbenso sämtliche Elemente (“Widgets“)

Benutzeroberflächen sollen auch mit wenig Programmiererfahrung leicht zu erstellen sein

Einfaches Beispiel einer GUI(1)Frame {

title: "Hallo Rich Internet Application!"

background: white

content:

BorderPanel {

top: FlowPanel {

content: Button {

text: "Klick Mich!"

action: operation() {

MessageDialog {

title: "JavaFX Script!"

message: "JavaFX Script ist einfach toll!"

visible: true

}

}

}

}

Einfaches Beispiel einer GUI(2) Center: Canvas {

content: Text {

font: Font {

faceName: "Verdana"

size: 24

}

x: 20

y: 40

fill: green

content: "JavaFX Script und RIAs"

}

}

}

width: 350

height: 140

visible: true

}

Einfaches Beispiel einer GUI(3)

Dieser Code erzeugt folgende Fenster:

Vielen Dank für Ihre Aufmerksamkeit.

Haben Sie Fragen?