Simon’s Blog

Update 15 February, 2009:  Be sure to head on over to JFXStudio, the new JavaFX Community site, for more JavaFX demos and examples.

It’s still early days for the JavaFX platform, and the API is not yet feature complete.   If you’re writing JavaFX for the desktop, and you find yourself needing something that JavaFX can’t do, it’s straightforward to extend the functionality of JavaFX by using custom Swing components written in Java.  If you’re interested in knowing how to do this, here’s how…

Caveats and Things To Know About This Example

• I suspect this example will only work properly on Windows XP and Vista.  It should start up without throwing any errors on most platforms, but the functionality likely won’t work.   That means, you can start up the app, but don’t expect it to work properly if you’re not running Windows (I know for sure it doesn’t work either on the Mac in Safari or Firefox, or on Linux in Firefox).  I’m not sure why.
• The app isn’t supposed to look nice!  It’s a minimal example to show you how to do this kind of thing.

About the app

• JavaFX 1.0 doesn’t (as far as I know) support Drag ‘n’ Drop of files from the native file system.  So the idea of the app was to extend the functionality of JavaFX GUIs to support: Drag ‘n’ Drop and; doing time-consuming calculations on a background thread, by writing that functionality in Java.
• The app runs as an applet inside your web browser.  Because it needs access to your local file system (for dragging and dropping the file), at start-up, you will need to click on a security dialog box or two to give the app the access it needs.   The app doesn’t send any information about the file you drag and drop over the network, so don’t worry about what file you drag on.   All the app does is compute an MD5 checksum of the file you drop onto it, and display the result.

Launching The App

It’s best to open the page in a new tab of your browser, so you can look at the source code below on this page.  Here’s the link you need for launching the app – the web-page with the embedded JavaFX applet.  You will need to click on the orange box after the app has started in order for the drag and drop to work – don’t ask me why, it seems to be a JavaFX bug/feature  (also see the caveats above if you’re not running Windows).

The JavaFX Source Code

Here’s the full JavaFX Script code for the app.  I’ve tried to keep it pretty minimal (most of the code is comments). Hopefully, it’s self-explanatory…

package checksumfx;

import checksum.ChecksumPanel;
import javafx.ext.swing.SwingComponent;
import javafx.scene.Group;
import javafx.scene.paint.Color;
import javafx.scene.Scene;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;

/*
 * A JavaFX Demo
 * Simon Brocklehurst, February 2009
 */

/* Bring a custom Java Swing component into JavaFX.
 * This component does things you can't do in JavaFX 1.0,
 * so extends the functionality of the JavaFX platform.
 * The component is an orange rectangle that allows a
 * file from your desktop to be drag and dropped onto it,
 * and then computes an MD5 checksum in the background and
 * displays the result.  The Java class is called ChecksumPanel
 * and is instantiated by calling a method .create(). This
 * class extends a Swing JPanel.
 */
var checksumPanel = ChecksumPanel.create();
checksumPanel.setPreferredSize(new java.awt.Dimension(500,150));
var checksumComponent = SwingComponent.wrap(checksumPanel);

/* Now, do a simple JavaFX manipulation on the imported Java Swing
 * component, just because we can (anything you can do with a regular
 * JavaFX scenegraph node, you can do to the wrapped Swing component).
 * Specifically, we make the orange rectangular JPanel have rounded
 * corners by setting the clip shape.
 */
checksumComponent.clip = Rectangle {
    width: 500
    height: 150
    arcHeight: 20
    arcWidth: 20
};

/* Create a simple JavaFX Stage showing
 * how the wrapped custom Swing component can be used
 * as part of a JavaFX GUI.  Now, the JavaFX GUI
 * can do drag and drop from the native file system.
 */
Stage {
    title: "ChecksumFX Demo - Extending JavaFX with Swing"
    width: 500
    height: 300
    scene: Scene {
        content: [
            checksumComponent,
            Text {
                font: Font {
                    size: 18
                }
                x: 20,
                y: 80
                content: "JavaFX and Swing together"
            }

        ]
    }
}