Newsletter sign-up
View all newsletters

Enterprise Java Newsletter
Stay up to date on the latest tutorials and Java community news posted on JavaWorld

Sponsored Links

Optimize with a SATA RAID Storage Solution
Range of capacities as low as $1250 per TB. Ideal if you currently rely on servers/disks/JBODs

Jump into JavaFX, Part 1: JavaFX Preview SDK

Experience JavaFX with NetBeans 6.1 and Project Nile

  • Print
  • Feedback

Page 5 of 6

The Illustrator plugin (for Windows) consists of AI2JavaFX.aip and AI2JavaFX.jar files, which are located in the illustrator subdirectory of the Project Nile install location. Similarly, the Photoshop plugin (for Windows) consists of a PS2JavaFX.8be file that's located in the photoshop subdirectory.

If Illustrator and Photoshop are installed prior to installing Project Nile, the Project Nile installer will automatically copy these plugin files to the appropriate Illustrator and Photoshop plugin directories. If you install either or both of these programs after installing Project Nile, you'll need to manually copy the plugin files to the appropriate plugin directories (see the Resources section for instructions).

Once the plugins are installed, you'll discover an option to save the Illustrator-based or Photoshop-based layered graphics to FXD or FX files the next time you start Illustrator or Photoshop. Because I don't have Illustrator or Photoshop installed, and because I'm not very good at using either program, I won't say more about the Project Nile plugins.

SVG Converter and JavaFX Graphics Viewer

Project Nile provides GUI and command-line versions of its SVG Converter (in the svg subdirectory) and JavaFX Graphics Viewer (in the viewer subdirectory) tools. The former tool lets you convert Scalable Vector Graphics-based visual content to FXD and FX files; the latter tool lets you view the graphics described by these files.

Let's play with SVG Converter and JavaFX Graphics Viewer. For starters, I've used a program called Inkscape (see Resources) to create a simple vector graphics drawing of some basic shapes, and then save the result to an XML-based SVG file called shapes.svg. Listing 2 presents this file's content, which I've slightly modified for display purposes.

Listing 2. shapes.svg

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:xlink="http://www.w3.org/1999/xlink"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="744.09448819"
   height="1052.3622047"
   id="svg2"
   sodipodi:version="0.32"
   inkscape:version="0.46"
   sodipodi:docname="shapes.svg"
   inkscape:output_extension="org.inkscape.output.svg.inkscape">
  <defs
     id="defs4">
    <inkscape:perspective
       sodipodi:type="inkscape:persp3d"
       inkscape:vp_x="0 : 526.18109 : 1"
       inkscape:vp_y="0 : 1000 : 0"
       inkscape:vp_z="744.09448 : 526.18109 : 1"
       inkscape:persp3d-origin="372.04724 : 350.78739 : 1"
       id="perspective3421" />
    <linearGradient
       id="linearGradient3217">
      <stop
         id="stop3219"
         offset="0"
         style="stop-color:#803200;stop-opacity:1;" />
      <stop
         style="stop-color:#401900;stop-opacity:0.49803922;"
         offset="0.5"
         id="stop3221" />
      <stop
         id="stop3223"
         offset="1"
         style="stop-color:#000000;stop-opacity:0;" />
    </linearGradient>
    <linearGradient
       inkscape:collect="always"
       xlink:href="#linearGradient3217"
       id="linearGradient3213"
       x1="122.85714"
       y1="-22.745518"
       x2="541.95331"
       y2="-22.745518"
       gradientUnits="userSpaceOnUse"
       spreadMethod="reflect" />
    <filter
       inkscape:collect="always"
       id="filter3389"
       x="-0.24714218"
       width="1.4942844"
       y="-0.066440908"
       height="1.1328818">
      <feGaussianBlur
         inkscape:collect="always"
         stdDeviation="43.259785"
         id="feGaussianBlur3391" />
    </filter>
  </defs>
  <sodipodi:namedview
     id="base"
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1.0"
     gridtolerance="10000"
     guidetolerance="10"
     objecttolerance="10"
     inkscape:pageopacity="0.0"
     inkscape:pageshadow="2"
     inkscape:zoom="0.35"
     inkscape:cx="375"
     inkscape:cy="522.94575"
     inkscape:document-units="px"
     inkscape:current-layer="layer1"
     showgrid="false"
     inkscape:window-width="1024"
     inkscape:window-height="768"
     inkscape:window-x="0"
     inkscape:window-y="0" />
  <metadata
     id="metadata7">
    <rdf:RDF>
      <cc:Work
         rdf:about="">
        <dc:format>image/svg+xml</dc:format>
        <dc:type
           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <g
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     id="layer1">
    <path
       sodipodi:type="arc"
       style="opacity:0.77490779;fill:#ff0000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:4, 1;stroke-dashoffset:0"
       id="path3411"
       sodipodi:cx="338.57144"
       sodipodi:cy="316.64789"
       sodipodi:rx="167.14285"
       sodipodi:ry="167.14285"
       d="M 505.71429,316.64789 A 167.14285,167.14285 0 1 1 171.42859,316.64789 A 167.14285,167.14285 0 1 1 505.71429,316.64789 z" />
    <path
       sodipodi:type="arc"
       style="opacity:0.77490778999999999;fill:#0000ff;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:4, 1;stroke-dashoffset:0"
       id="path3413"
       sodipodi:cx="455.71429"
       sodipodi:cy="505.21933"
       sodipodi:rx="110"
       sodipodi:ry="110"
       d="M 565.71429,505.21933 A 110,110 0 1 1 345.71429,505.21933 A 110,110 0 1 1 565.71429,505.21933 z" />
    <rect
       style="fill:#ffff00;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
       id="rect3415"
       width="268.57144"
       height="268.57144"
       x="62.857143"
       y="680.93359" />
    <rect
       style="fill:#008000;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
       id="rect3417"
       width="242.85715"
       height="242.85715"
       x="262.85715"
       y="786.64789" />
    <path
       sodipodi:type="star"
       style="opacity:0.77490778999999999;fill:#ff00ff;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:4, 1;stroke-dashoffset:0;stroke:#ff00ff"
       id="path3419"
       sodipodi:sides="5"
       sodipodi:cx="65.714286"
       sodipodi:cy="66.647897"
       sodipodi:r1="69.575975"
       sodipodi:r2="34.787988"
       sodipodi:arg1="0.33473684"
       sodipodi:arg2="0.96305537"
       inkscape:flatsided="false"
       inkscape:rounded="0"
       inkscape:randomized="0"
       d="M 131.42857,89.505038 L 85.578727,95.206748 L 64.282683,136.20914 L 44.691654,94.365272 L -0.88477702,86.781966 L 32.857145,55.219325 L 25.985405,9.5301921 L 66.430089,31.867274 L 107.75955,11.213143 L 99.013819,56.580861 L 131.42857,89.505038 z" />
    <g
       sodipodi:type="inkscape:box3d"
       style="opacity:0.77490779;fill:#ff00ff;stroke:#ff00ff;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:4, 1;stroke-dashoffset:0"
       id="g3423"
       inkscape:perspectiveID="#perspective3421"
       inkscape:corner0="-0.34564555 : 0.40317749 : 0 : 1"
       inkscape:corner7="-0.35853925 : 0.39135817 : 1.5147279 : 1">
      <path
         sodipodi:type="inkscape:box3dside"
         id="path3435"
         style="fill:#e9e9ff;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="11"
         d="M 691.14384,421.1672 L 695.27678,420.53923 L 695.27678,426.02081 L 691.14384,426.61619 L 691.14384,421.1672 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path3425"
         style="fill:#353564;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="6"
         d="M 568.57142,178.0765 L 568.57142,196.13906 L 691.14384,426.61619 L 691.14384,421.1672 L 568.57142,178.0765 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path3427"
         style="fill:#4d4d9f;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="5"
         d="M 568.57142,178.0765 L 580.00001,171.07941 L 695.27678,420.53923 L 691.14384,421.1672 L 568.57142,178.0765 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path3433"
         style="fill:#afafde;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="13"
         d="M 568.57142,196.13906 L 580.00001,189.50505 L 695.27678,426.02081 L 691.14384,426.61619 L 568.57142,196.13906 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path3431"
         style="fill:#d7d7ff;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="14"
         d="M 580.00001,171.07941 L 580.00001,189.50505 L 695.27678,426.02081 L 695.27678,420.53923 L 580.00001,171.07941 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path3429"
         style="fill:#8686bf;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="3"
         d="M 568.57142,178.0765 L 580.00001,171.07941 L 580.00001,189.50505 L 568.57142,196.13906 L 568.57142,178.0765 z" />
    </g>
  </g>
</svg>

Suppose that we want to access this SVG content from a JavaFX script. Before we can do this, we need to convert the content to something that a script would understand. The SVG Converter tool comes to the rescue, allowing us to convert shapes.svg to an equivalent shapes.fx file. Figure 12 reveals this tool's GUI.

  • Print
  • Feedback

Resources

More from JavaWorld