JavaFX Testdrive und Pseudo-Tutorial :-)

Rich Internet Applications (RIAs) sind (ursprünglich) Webapplikationen, die aber Benutzeroberflächen, Look & Feel und Funktionalitäten ähnlich einer Desktop-Applikation bieten. Stichworte sind kein neuerliches Laden einer Seite, wenn sich die Inhalte ändern, Drag & Drop, Animation usw.

Sun springt mit JavaFX auch auf diesen Zug auf. Ende Juli 2008 wurde eine erste Preview SDK auf der Produktseite veröffentlicht. Mit JavaFX möchte Sun eine komplette Produktlinie zur Verfügung stellen, um RIAs zu entwickeln. Hierzu gehören sowohl Tools zur Programmierung bzw. zum Skripten (Netbeans IDE), als auch Werkzeuge zur Content-Erstellung (Project Nile).

Einer der wichtigsten Bestandteile der Produktlinie ist JavaFX Script. Diese Skriptsprache dient der Definition des Aussehens und Verhaltens einer Benutzeroberfläche. JavaFX Script ist damit vergleichbar zu ActionScript, wie es in Adobe Flash / Flex / Air Verwendung findet. Zunächst stellt sich die Frage, warum man überhaupt eine neue Skriptsprache braucht. Schließlich wurde beispielsweise mit Groovy eine eingefügt. Einer der Hauptgründe ist wohl, dass es dem Benutzer möglichst einfach gemacht werden soll, dynamische Benutzeroberflächen zu definieren.

Dann wollen wir mal schauen, ob das Ganze was taugt :-)

JavaFX Preview SDK und Netbeans herunterladen

Netterweise gibt es von Sun ein Paket, dass JavaFX und die Entwicklungsumgebung Netbeans bündelt. Einfach herunterladen und installieren. Zurzeit gibt es dieses Paket für Windows und Mac OS X.

Neues JavaFX Projekt anlegen

Nachdem Netbeans gestartet wurde, legt man ein neues Projekt über “File > New Project” an. Als Vorlage wählt man “JavaFX Script Application” in der Kategorie “JavaFX”. Noch schnell einen Projektnamen (z.B. TestdriveJavaFX) und schon geht’s ans Eingemachte. Wir erhalten nun ein leeres Projekt.

Leeres JavaFX Projekt

Leeres JavaFX Projekt

Weiter geht’s

Im Projekt wurde bereits eine Datei “Main.fx” angelegt. Dies ist das JavaFX Script. Zurzeit sollte die Datei ungefähr so aussehen:

/*
 * Main.fx
 *
 * Created on 21.08.2008, 17:14:46
 */
 
package testdrivejavafx;
 
import javafx.application.Frame;
import javafx.application.Stage;
import javafx.scene.text.Text;
import javafx.scene.Font;
import javafx.scene.FontStyle;
 
/**
 * @author Sebastian
 */
 
// place your code here

Auf der rechten Seite des Netbeans Fenster findet sich die Palette. Hier können visuelle Elemente per Drag & Drop dem Skript hinzugefügt werden. Zunächst benötigen wir ein Frame aus dem Bereich “Applications” der Palette. Dies definiert ein Fenster, in dem später die Inhalte der Applikation angezeigt werden. Durch ziehen des Frames in das Code-Fenster unter //place your code here wird das entsprechende Code-Segment eingefügt. Das Ganze sollte jetz so aussehen:

/*
 * Main.fx
 *
 * Created on 21.08.2008, 17:14:46
 */
 
package testdrivejavafx;
 
import javafx.application.Frame;
import javafx.application.Stage;
import javafx.scene.text.Text;
import javafx.scene.Font;
import javafx.scene.FontStyle;
 
/**
 * @author Sebastian
 */
 
// place your code here
Frame {
    title: "MyApplication"
    width: 200
    height: 200
    closeAction: function() {
        java.lang.System.exit( 0 );
    }
    visible: true
 
    stage: Stage {
        content: []
    }
}

Die Werte nach title, width und height beschreiben natürlich die Attribute Titel, Breite und Höhe des Fensters.

Ein Klick auf den Run-Button genügt zum Starten der Applikation. Ohne eine Zeile Code selbst zu schreiben, wurde ein Fenster geöffnet. Wer Swing kennt weiß, dass das ziemlich schnell ging für Java ;-)

Ein Fenster… und jetzt?

Jetzt könnte man anfangen, das Fenster mit Inhalt zu füllen. Versucht doch mal einige Elemente in die eckigen Klammern von content: [] aus der Palette zu ziehen. Auf diese Weise können sehr schnell Texte und einfache geometrische Formen in das Fenster plaziert werden. Experimentiert :-)

Das ist natürlich noch ziemlich wenig. Interessant wird es erst, wenn es in den Bereich Animation und die Verzahnung mit regulären Java Code geht. Das hebe ich mir aber für später auf (muss das erstmal selbst lernen)…

Wie… das war’s schon?!

Na ja, so ziemlich. Wer sich Appetit holen will, dem empfehle ich das folgende Video von der diesjährigen JavaOne Konferenz. Es werden einige interessante JavaFX Demos gezeigt.

Update: Das Video ist leider nicht mehr verfügbar!

One Response to “JavaFX Testdrive und Pseudo-Tutorial :-)”

  1. semantic-void.net » Blog Archive » Noch mehr JavaOne: Applets are back! Says:
    January 4th, 2011 at 18:00

    [...] letzten Eintrag habe ich bereits von den Videos zur JavaOne 2008 berichtet. Hier ist ein [...]

Leave a Reply