Seite 4: CSS und Fazit

Inhaltsverzeichnis

Jetzt noch bunter

Ein weiteres Novum in JavaFX ist die Verwendung von CSS (Cascading Style Sheets) zur Darstellung von Kontrollelementen oder Ähnlichem. Dabei kommt CSS 2.1 (nach W3C) zum Einsatz. Anhand der in Abbildung 7 gezeigten Animation lässt sich zeigen, wie man beispielsweise den Stil des Kreises mit CSS verändern kann.

Der Kreis soll nun statt einfach schwarz mit einem Farbgradienten gefüllt und mit einem Schlagschatten versehen werden. Das lässt sich mit folgendem Code umsetzen, der in einer einzelnen Datei zu speichern ist (hier demo.css):

.circle {
    -fx-fill : radial-gradient(center 50% 25%,
                               radius 75%,
                               rgb(122,255,77) 0%,
                               rgb(0,102,0) 100%);
    -fx-effect: dropshadow(gaussian,
                           rgba(0, 0, 0, 0.65),
                           10, 0.0, 5, 5);
}

Diesen Style mit dem Selector .circle muss man nun der Kreis-Shape zuweisen. In JavaFX geschieht das durch den Aufruf von getStyleClass().add(".circle"), womit es jedoch noch nicht getan ist, da man der Anwendung noch mitteilen muss, dass sie das Stylesheet laden muss. Das lässt sich durch den Aufruf von

getStyleSheets().add(getClass().getResource("demo.css").toExternalForm())
 

erreichen.

Das Beispiel von oben sieht demnach wie folgt aus:

private static final long INTERVAL      = 2_000_000_000l;
private Circle            circle        = new Circle(50);
private long              lastTimerCall = System.nanoTime();
private boolean           toggle        = false;
private AnimationTimer    timer = new AnimationTimer() {
    @Override public void handle(long now) {
        if(now > lastTimerCall + INTERVAL) {
            toggle ^= true;
            circle.setVisible(toggle);
            lastTimerCall = now;
        }
    }
};

@Override public void start(Stage stage) {
    // Add the style class to the circle shape
    circle.getStyleClass().add("circle");

    StackPane pane = new StackPane();
    pane.setPadding(new Insets(10, 10, 10, 10));
    pane.getChildren().add(circle);

    Scene scene = new Scene(pane);

    // Add the stylesheet to the scene
    scene.getStylesheets().add(getClass()
        .getResource("demo.css").toExternalForm());

    stage.setScene(scene);
    stage.show();

    // Start the timer
    timer.start();
}

Führt man den Code aus, erhält man wieder den blinkenden Kreis, diesmal jedoch mit einem radialen Gradienten gefüllt und einem Schatten versehen.

Fazit

Mit JavaFX ist Java gut gerüstet, um grafisch ansprechende Anwendungen zu gestalten. Der Umfang von JavaFX ist selbstverständlich wesentlich größer, als es sich in diesem Artikel darstellen lässt, weshalb lediglich ein paar Highlights beleuchtet wurden. Allerdings fehlen in der aktuellen Version 2.2 von JavaFX noch wesentliche Bestandteile, die man von einer Benutzeroberfläche erwarten würde. So sind zur Zeit noch keine Dialoge vorhanden, was den Einsatz von JavaFX 2.2 in Business-Applikationen ein wenig erschwert, da man sie sich selbst erstellen muss. Auch ein TreeTable-Control sucht man zur Zeit noch vergebens. Als Ausblick sei jedoch erwähnt, dass diese Dinge in der nächsten Version von JavaFX (JavaFX 8) vorhanden sein werden.

Gerrit Grunwald
arbeitet als Software Engineer bei der Canoo Engineering AG (Schweiz). Dort beschäftigt er sich bevorzugt mit JavaFX, Java Swing und HTML5. Außerdem ist er Mitgründer und Leader der Java Usergroup Münster sowie Community Co-Lead der JavaFX Community. (jul)