JavaFX fliegt aus dem JDK

So schreibt es Oracle unter https://blogs.oracle.com/java-platform-group/the-future-of-javafx-and-other-java-client-roadmap-updates

Starting with JDK 11, Oracle is making JavaFX easier to adopt by making the technology available as a separate download, decoupled from the JDK. These changes clear the way for new contributors to engage in the open source OpenJFX community. Meanwhile, Oracle customers can benefit from continued commercial support for JavaFX in the Oracle JDK 8 through at least 2022.

With the Java Platform Module System in place since Java SE 9, it now more viable to decouple JavaFX from the JDK, in order to make it available as a separate download.  This will make it easier for developers using JavaFX to have more freedom and flexibility with the framework.  Moreover, with our focus on increasing the release cadence of OpenJDK, JavaFX needs to be able to move forward at a pace driven by the contributions from Oracle and others in the OpenJFX community. Oracle plans to implement this decoupling starting with Java 11 (18.9 LTS).

Xbox 360 Kinect unter Java ansprechen

  1. Windows anmachen 🙂
  2. Kinect mit dem USB-Power-Adapter anstöpseln.
  3. Unter http://www.microsoft.com/en-us/download/details.aspx?id=40278 das Kinect for Windows SDK v1.8 laden und. (Nicht Version 2!) Die grüne Lampe wird leuchten.
  4. Unter dem Geräte Manager wird Kinect angezeigt:
    image
  5. Optional: Für ein paar Beispiele installiere von http://www.microsoft.com/en-us/download/details.aspx?id=40276 das Kinect for Windows Developer Toolkit v1.8.
    Unter Developer Toolkit Browser v1.8.0 (Kinect for Windows) kann man dann Beispiele anschauen und prüfen, ob die Kamera einen “empfängt”.image
  6. Gehe unter http://research.dwi.ufl.edu/ufdw/download.php und lade ufdw.jar. Melde das Jar im Klassenpfad an.
  7. Lade ein Beispiel von http://research.dwi.ufl.edu/ufdw/j4k/examples.php, entpacke es, und setze für ein 64-Bit-Java die DLL-Dateien (ufdw_j4k_64bit.dll/ufdw_j4k2_64bit.dll) in das Java-Projekt.

Das waren die Vorbereitungen, jetzt können wir zum eigentlichen Java-Programm kommen. Zum Testen soll einfach nur die Orientierung (also der Winkel zur Kinect) in den Winkel einer 3D-Box übertragen werden – dreht man sich vor der Kinect, wird die Box sich mitdrehen. Gleichzeitig gibt es noch einen Text, sodass man den Winkel gleich ablesen kann.

 

Fertig sieht das so aus:

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.shape.Box;
import javafx.scene.text.Text;
import javafx.scene.transform.Rotate;
import javafx.stage.Stage;
import edu.ufl.digitalworlds.j4k.J4KSDK;
import edu.ufl.digitalworlds.j4k.Skeleton;

public class MovingBody extends Application {

  private final Box box = new Box( 200, 200, 200 );
  private final Text text = new Text( 200, 200, "#" );
  
  class SkeletonTracker extends J4KSDK {

    @Override
    public void onSkeletonFrameEvent( boolean[] skeletonTracked, float[] positions,
                                      float[] orientations, byte[] jointStatus ) {

      int skeletonId = 0;
      while ( !skeletonTracked[ skeletonId ] )
        skeletonId++;

      Skeleton skeleton = Skeleton.getSkeleton( skeletonId, skeletonTracked, positions,
                                                orientations, jointStatus, this );

      box.setRotate( (int) skeleton.getBodyOrientation() );  // reduce "noise" with (int)
      text.setText( "" + (int) skeleton.getBodyOrientation() );
      text.setRotate( (int) skeleton.getBodyOrientation() );
    }
    
    @Override
    public void onColorFrameEvent( byte[] colorData ) { }

    @Override
    public void onDepthFrameEvent( short[] depthFrame, byte[] playerIndex, float[] xyz, float[] uv ) { }
  }

  public MovingBody() {
    new SkeletonTracker().start( J4KSDK.SKELETON );
  }

  @Override
  public void start( Stage primaryStage ) {
    Group root = new Group();
    primaryStage.setScene( new Scene( root, 400, 400 ) );
    primaryStage.show();
    
    box.setTranslateX( 200 );
    box.setTranslateY( 200 );
    box.setTranslateZ( 200 );
    box.setRotationAxis( Rotate.Y_AXIS );

    root.getChildren().addAll( box, text );
  }

  public static void main( String[] args ) {
    launch( args );
  }
}

image

SceneBuilder 2.0 final

SceneBuilder 2.0 ist nun final, das Beta zog sich lange hin:

It has many cool new features and was a complete rewrite from the ground up so that it can be split into parts and embedded in your favorite IDE.

Updates unter http://fxexperience.com/2014/05/announcing-scenebuilder-2-0/, http://docs.oracle.com/javase/8/scene-builder-2/release-notes/jfxsb-release_notes_2-0.htm:

  • JavaFX Scene Builder Kit. JavaFX Scene Builder Kit is an API that allows the integration of Scene Builder panels and functionalities directly into the GUI of a larger application, or a Java IDE, such as NetBeans, IntelliJ, and Eclipse. See Working with the JavaFX Scene Builder Kit for more details.

  • Ability to add custom GUI components to the Library. Custom components imported from a third party JAR file can now be added permanently to the Library of available GUI components. See Adding Custom Components to the Library for more information.

  • Support for new JavaFX 8 UI components. The new UI components, TreeTableView, DatePicker, and SwingNode, that were introduced in the Java SE 8 are now supported in Scene Builder 2.0. To see the list of JavaFX 8 UI components that are available, type FX8 in the Library panel’s search text field.

  • 3D Support. FXML documents containing 3D objects can now be loaded and saved in the Scene Builder tool. You can view and edit properties of the 3D objects using the Inspector panel. You can not, however, create new 3D objects using the Scene Builder tool. See JavaFX Scene Builder User Guide for more information.

  • Support for Rich Text. A new container, TextFlow, is now available in the Library of GUI components. You can drag multiple text nodes and other types of nodes, into the a TextFlow container. You can also directly manipulate the text nodes to re-arrange them in the container. Inline and property editing features are also available for each text node.

  • Library Panel Improvements. The default viewing option for the Library panel is a new feature that gives you the option to view all the component categories as collapsible sections.

  • Hierarchy Panel Improvements. It is now more flexible to re-parent objects from one container to another container. It is also possible to drag and drop an object from the Hierarchy Panel to the Content Panel, and vice versa. You can also now select multiple objects in the Hierarchy Panel in order to re-parent them.

  • Content Panel Improvements. You can now manipulate the components of an HBox, VBox, FlowPane, or Toolbar container directly in the Content Panel to re-order them. You can also insert a new component at any position in the container. Note that this direct manipulation is currently not available for the TilePane container.

  • Inspector Panel Improvements. Many property editors in the Inspector panel use the Suggested List dialog window, which displays a list of selectable values from which you can make a selection instead of manually entering them. For example, the CSS Style editor provides a list of applicable CSS properties, based on the currently selected object(s). List handling has also been simplified. Multi-selection of components of different types (i.e. Button + TextField) is now supported. In addition, the usability of many of the property editors, such as AnchorPane Constraints, Rotate, and Padding, have been improved.

  • Preview Window Improvements. The content in the Preview window is now automatically refreshed as the current FXML document is being edited. Hence, there’s no need to use the Refresh command in order to preview the modified UI layout.

  • Change in the Include FXML Command. When you click File from the Menu bar and then click Include, you can only select the FXML menu item if the current FXML document you are editing is saved on your system’s disk and is not empty.

RichTextFX (GPLv2 with the Classpath Exception)

Seit JavaFX 8 kann JavaFX dank TextFlow problemlos Text mit unterschiedlichen Formatierungen anzeigen. RichTextFX (ehemals CodeAreaFX) greift darauf zurück und bietet mit StyleClassedTextArea eine Komponente, bei der einfach gewisse Teile vom Text ausgezeichnet werden können. Ein kleiner Editor kommt als Demo mit:

Screenshot of the RichText demo

Weiterhin gibt es eine vorgefertigte Editor-Komponente an, die als Basis für eigene Code-Editoren dienen kann:

Screenshot of the JavaKeywords demo

Über Code oder CSS lässt sich die Darstellung ändern. 

Weiter FX-Komponenten unter http://www.tutego.de/java/javafx-komponenten.htm.

ReactFX (https://github.com/TomasMikula/ReactFX)

Thomas Mikula fasst die JavaFX 8 Bibliothek ReactFX mit den Worten "Reactive event streams, inhibitable bindings and more for JavaFX" zusammen. Die Bibliothek veröffentlicht spezifische Ereignisse einer JavaFX-Anwendung auf einer Art lokalen Bus (Typ EventStream) und erlaubt es auf der anderen Seite Klienten an diesem EventStream Bus zu lauschen. Geht es zum Beispiel darum Maus-Klicks auf einem Knoten zu registrieren und dann bei Klicks Code auszuführen sieht es im Code so aus:

EventStream<MouseEvent> clicks = EventStreams.eventsOf( node, MouseEvent.MOUSE_CLICKED );
clicks.subscribe( click -> System.out.println("Klick!") );

So gesehen bietet die API noch keinen Vorteil, spannend wird es, wenn der EventStream gefiltert, mit anderen EventStreams verschmolzen oder die Ereignisse gemappt werden — die Programmierung erinnert an die neue Stream-API aus Java 8.

Weitere FX-Komponenten unter http://www.tutego.de/java/javafx-komponenten.htm.

tutego bietet auch ein JavaFX-Seminar an: http://www.tutego.de/seminare/java-schulung/JavaFX-Seminar-JavaFX-Script-Kurs.html

JavaFX: Put a draggable, resizable polygon on an image

import java.util.concurrent.atomic.AtomicInteger;
import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.event.EventHandler;
import javafx.scene.Cursor;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Polygon;
import javafx.stage.Stage;

class DrawingPane extends Pane
{
  public DrawingPane( Image image, Polygon poly )
  {
    poly.setFill( Color.web( "ANTIQUEWHITE", 0.8 ) );
    poly.setStroke( Color.web( "ANTIQUEWHITE" ) );
    poly.setStrokeWidth( 2 );

    getChildren().addAll( new ImageView( image ), poly );

    for ( int i = 0; i < poly.getPoints().size(); i += 2 ) {
      Circle circle = new Circle( poly.getPoints().get( i ), poly.getPoints().get( i + 1 ), 5 );
      circle.setFill( Color.web( "PERU", 0.8 ) );
      circle.setStroke( Color.PERU );
      circle.setStrokeWidth( 2 );

      AtomicInteger polyCoordinateIndex = new AtomicInteger( i );
      circle.centerXProperty().addListener( new ChangeListener<Number>() {
        @Override
        public void changed( ObservableValue<? extends Number> observable, Number oldValue, Number newValue ) {
          poly.getPoints().set( polyCoordinateIndex.get(), newValue.doubleValue() );
        }
      } );
      circle.centerYProperty().addListener( new ChangeListener<Number>() {
        @Override
        public void changed( ObservableValue<? extends Number> observable, Number oldValue, Number newValue ) {
          poly.getPoints().set( polyCoordinateIndex.get() + 1, (Double) newValue );
        }
      } );
      setDragHandler( circle );
      getChildren().add( circle );
    }
  }

  private double dragDeltaX, dragDeltaY; 

  private void setDragHandler( Circle circle )
  {
    circle.setOnMousePressed( new EventHandler<MouseEvent>() {
      @Override public void handle( MouseEvent mouseEvent ) {
        dragDeltaX = circle.getCenterX() - mouseEvent.getSceneX();
        dragDeltaY = circle.getCenterY() - mouseEvent.getSceneY();
      }
    } );

    circle.setOnMouseDragged( new EventHandler<MouseEvent>() {
      @Override public void handle( MouseEvent mouseEvent ) {
        circle.setCenterX( mouseEvent.getSceneX() + dragDeltaX );
        circle.setCenterY( mouseEvent.getSceneY() + dragDeltaY );
        circle.setCursor( Cursor.MOVE );
      }
    } );

    circle.setOnMouseEntered( new EventHandler<MouseEvent>() {
      @Override public void handle( MouseEvent mouseEvent ) {
        circle.setCursor( Cursor.HAND );
      }
    } );

    circle.setOnMouseReleased( new EventHandler<MouseEvent>() {
      @Override public void handle( MouseEvent mouseEvent ) {
        circle.setCursor( Cursor.HAND );
      }
    } );
  }
}

public class JavafxDemo extends Application
{
  @Override
  public void start( Stage stage )
  {
    Image image = new Image( "http://tours-tv.com/uploads/maps/map-Medizinische-Hochschule-Hannover-karta.jpg" );
    Polygon poly = new Polygon( 10, 10, 100, 10, 200, 100, 50, 200 );

    stage.setScene( new Scene( new DrawingPane( image, poly ), 450, 300 ) );
    stage.show();
  }

  public static void main( String[] args )
  {
    launch( args );
  }
}

JavaFX vertical text scroller in effectively 4 lines

import javafx.animation.*;
import javafx.application.Application;
import javafx.scene.*;
import javafx.scene.text.Text;
import javafx.stage.Stage;
import javafx.util.Duration;

public class FxScroller extends Application
{
  @Override
  public void start( Stage stage )
  {
    Text text = new Text( 600, 20, "It is a period of civil war. Rebel spaceships, striking from a hidden base, have won their first victory against the evil Galactic Empire." );
    new Timeline( new KeyFrame( Duration.seconds( 20 ),
                  new KeyValue( text.xProperty(), -text.getBoundsInLocal().getWidth() - 1) ) ) .play();
    stage.setScene( new Scene( new Group( text ), 600, 30 ) );
    stage.show();
  }

  public static void main( String[] args )
  {
    launch( args );
  }
}

JavaFX + CDI (Weld)

Put in the class path:

The challenge is to bring FXMLLoader and CDI together, because JavaFX is creating naked objects by itself, now they have to be „CDI-aware“.

package tutego.fx;

import java.nio.charset.*;
import javafx.fxml.FXMLLoader;
import javafx.util.Callback;
import javax.enterprise.inject.Instance;
import javax.enterprise.inject.Produces;
import javax.inject.Inject;

public class FXMLLoaderProducer
{
  @Inject
  Instance<Object> instance;

  @Produces
  public FXMLLoader createLoader()
  {
    return new FXMLLoader( null, null, null, new Callback<Class<?>, Object>() {
      @Override public Object call( Class<?> param ) {
        return instance.select( param ).get();
      }
    }, StandardCharsets.UTF_8 );
  }
}

That was the hardest part.

The first regular class has the unique main(String[]) method and it’s a JavaFX application. It starts Weld, the CDI container.

package tutego.fx;

import java.io.IOException;
import javafx.application.Application;
import javafx.stage.Stage;
import org.jboss.weld.environment.se.*;

public class Main extends Application
{
  private Weld weld;

  public static void main( String[] args )
  {
    Application.launch( args );
  }

  @Override
  public void init()
  {
    weld = new Weld();
  }

  @Override
  public void start( Stage stage ) throws IOException
  {
    weld.initialize().instance().select( FxMain.class ).get().start( stage, getParameters() );
  }

  @Override
  public void stop()
  {
    weld.shutdown();
  }
}

Weld delegates to the FxMain class, the first CDI-enabled class:

package tutego.fx;

import java.io.*;
import javafx.application.Application.Parameters;
import javafx.fxml.FXMLLoader;
import javafx.scene.*;
import javafx.stage.Stage;
import javax.inject.Inject;

public class FxMain
{
  @Inject
  private FXMLLoader fxmlLoader;

  public void start( Stage stage, Parameters parameters ) throws IOException
  {
    try ( InputStream fxml = RandomController.class.getResourceAsStream( "/random.fxml" ) ) {
      Parent root = (Parent) fxmlLoader.load( fxml );
      stage.setScene( new Scene( root ) );
      stage.show();
    }
  }
}

The injected FXMLLoader now has to load the FXML-file random.fxml:

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>

<VBox xmlns:fx="http://javafx.com/fxml" fx:controller="tutego.fx.RandomController">
  <children>
    <Button onAction="#onButtonClick" text="Next random" />
    <Label id="text" fx:id="label" />
  </children>
</VBox>

In the FXML-file there is a reference to the FX Controller. JavaFX has to load it and can make the injections with the help of our very first class. A regular service is getting injected into the controller:

package tutego.fx;

import javafx.fxml.FXML;
import javafx.scene.control.Label;
import javax.inject.Inject;

public class RandomController
{
  @FXML
  private Label label;

  @Inject
  private RandomService randomService;

  @FXML
  public void onButtonClick()
  {
    label.setText( "Random " + randomService.nextInt() );
  }
}

The service itself is a simple singleton:

package tutego.fx;

import java.util.Random;
import javax.inject.Singleton;

@Singleton
public class RandomService
{
  private Random rnd = new Random();

  public int nextInt()
  {
    return rnd.nextInt();
  }
}

Thats it!

PS: When you start, dont forget to put a (even blank) beans.xml in META-INF.

GUI-Builder für JavaFX und Swing

Mit einem GUI-Builder lassen sich grafische Oberflächen über ein grafisches Werkzeug einfach aufbauen. In der Regel bietet ein GUI-Bilder eine Zeichenfläche und eine Symbolleiste mit Komponenten, die per Drag and Drop angeordnet werden. Zentral bei dem Ansatz ist das WYSIWYG-Prinzip (What You See Is What You Get), dass nämlich im Designschritt schon abzulesen ist, wie die fertige Oberfläche aussieht.

Ein GUI-Builder erzeugt eine Repräsentation der grafischen Oberfläche, die im Prinzip auch von Hand zu erstellen wäre – allerdings ist der Aufwand sehr groß und für jeden nachvollziehbar, der schon einmal in HMTL eine neue Tabellenspalte hinzugeführt hat. Es gibt immer wieder Diskussion über das Für und Wider doch ist es wie mit allen Tools: richtig eingesetzt kann ein GUI-Builder viel Arbeit sparen.

GUI-Builder für JavaFX

Der JavaFX Scene Builder ist ein Werkzeug von Oracle und nennt sich selbst „A Visual Layout Tool for JavaFX Applications“. Er ist kein Teil vom JDK, sondern muss unter http://www.oracle.com/technetwork/java/javafx/tools/index.html bezogen und installiert werden. Danach stehen komfortable Werkzeuge zum Entwurf von Oberflächen und deren Verschönerung mit CSS nichts im Wege.

NetBeans bietet von Haus aus Unterstützung im Entwurf grafischer Oberflächen, denn ein GUI-Bilder ist integriert, und eine Zusatzinstallation ist nicht nötig. Das gibt uns direkte Möglichkeiten, Swing und auch JavaFX spielerisch zu erfahren.[1]

Für Eclipse gibt es keinen speziellen GUI-Builder, das ist auch eigentlich gar nicht nötig, denn der Scene Builder kann in Eclipse integriert werden.[2] Zwar kein direkter WYSIWYG-Editor, aber immerhin ein Werkzeug im Umgang mit XML ist das quelloffenes Eclipse-Plugin e(fx)clipse unter http://efxclipse.org/.

GUI-Builder für Swing

Während NetBeans für Swing gute Unterstützung mitbringt, ist bei Eclipse standardmäßig kein GUI-Builder integriert. Es gilt also, ein Plugin nachzuinstallieren. In den letzten Jahren kamen und gingen verschiedene GUI-Builder, aber letztendlich hat sich der WindowsBuilder (https://developers.google.com/java-dev-tools/wbpro/) von Google als De-facto-Standard etabliert. Über den Update-Mechanismus von Eclipse wird er installiert. Eine Installationsanleitung findet sich auf der Webseite. Neben Swing nimmt der WindowsBuilder gleich noch GWT, SWT und XWT (Eclipse XML Window Toolkit) mit.


[1] Didaktiker nennen das »exploratives Lernen«.

[2] http://docs.oracle.com/javafx/scenebuilder/1/use_java_ides/sb-with-eclipse.htm