FX

When you convert graphics to JavaFX format, a JavaFX Content File is created, with an FXZ extension. This topic contains more information about this compressed file format and the files it contains, including JavaFX Data Files (FXD).

Anatomy of a JavaFX Content File (FXZ)

FXZ is a compressed file format using zip compression. It always contains at least one FXD file, which is a text description of the graphic. In addition, the FXZ file might contain embedded assets, such as image files or True Type fonts.

You can view the files contained in the FXZ archive file by copying it into a JavaFX project in the NetBeans IDE, or you can uncompress the FXZ file using a zip utility.

Anatomy of a JavaFX Data File (FXD)

Graphic objects from the original graphic (layer items and attributes) are described in JavaFX Data Files (with an FXD extension). If the graphic was saved from Adobe Illustrator CS4 with the Use Artboards feature, there will be one FXD file for each artboard, plus one FXD master file. The master file is named content.fxd, and individual artboard files are named content-1.fxd, content-2.fxd, and so on.

You can view the image, or individual artboards, described in FXD files in either JavaFX Graphics Viewer (one of the Production Suite tools) or the NetBeans IDE. You can view the FXD graphic descriptions in the NetBeans IDE, or in a text editor if you unzipped the FXZ file manually.

FXD is a textual format using the same object literal syntax as JavaFX Script. Here is a simple FXD description of a smiley face:

Group { 
  id: "face"

  content: [
    Circle { id:"background" centerX:40 centerY:40 radius:39
    fill:Color.YELLOW stroke:Color.BLACK strokeWidth:3.0},
    Circle { centerX:25 centerY:30 radius:5 fill: Color.BLACK},
    Circle { centerX:55 centerY:30 radius:5 fill: Color.BLACK},
    Line{ startX:32 startY:23 endX:16 endY:15 stroke:Color.BLACK strokeWidth:4.0},
    Line{ startX:45 startY:23 endX:61 endY:15 stroke:Color.BLACK strokeWidth:4.0},
    QuadCurve { id: "mouth" stroke:Color.BLACK  strokeWidth:3.0 fill: Color.TRANSPARENT
      startX:20 startY:60 endX:60 endY:60 controlX:40 controlY:80
  }
  ]
 }
 
 

It is possible to copy and paste the descriptions from the FXD file directly into JavaFX Script code, with the exception of the Font.fontFromURL construct, which does not have a JavaFX Script equivalent.