So some weeks ago I read Jasper Potts blog on FXG to FXML-Conversion tool (useing simple XSL-Stylesheet). This blog Jasper asked if there’s probably one day someone providing a conversion tool for SVG.
This has been on my list for some time now and because I was traveling a bit in the last 2 weeks I had some time to hack on such a converter. I’ve not used XSL but instead used xtend (svg-parser (java),fxml-converter (xtend)) (because an XML-File comes with a lot of multiline strings). It took some time to wrap my head around SVG and how I could translate this in FXML/JavaFX 2.0 API calls but I finally I’m at a point where I have something to show off:
Please note that the JavaFX 2.0 image on the left is only made up of primitive JavaFX 2.0 elements (Circles, SVGPaths, Rect, Gradients, …) and it by far does not yet handle all the nifty stuff one can do with SVG but it shows me that such a conversion tool is doable to some extend though e.g. when it comes to filtering, … SVG has much more definitions than the JavaFX-API currently provides.
I was not even able to convert the SVG-Gaussian-Blur to JavaFX’ Gaussian-Blur (but that might just me I’m not an expert in graphics stuff), SVG allows to apply multiple filters/effects to a node, … . So to provide full SVG-Support – without residing to libraries like Batik – in JavaFX 2.x we’d need more API (or at least a tutorial how to e.g. write custom effects) but even with the current API one can get quite far as you don’t notice any missing thing in the above screenshot.
I’ve pushed the orignal svg-File (from the KDE oxygen-theme) and the resulting fxml-File to my git repo so that you can compare them.
Good Job !!
Fxml is so boring to write but interesting to use with cllaboration of graphic designers
Is there any chance to be able to download it ? or to see it packaged into e(fx)clipse ?
Yes the plan is to provide FXG and SVG import wizards within e(fx)clipse which can also run outside eclipse (e.g. as an ant-task)
Great News !!! I’m impatient ot test it !
Pingback: Java desktop links of the week, January 24 | Jonathan Giles
Pingback: JavaFX links of the week, January 24 // JavaFX News, Demos and Insight // FX Experience
Pingback: e(fx)clipse 0.0.12 released | Tomsondev Blog
Nice work! Converting single svgs goes fast and correct. Tried to convert a larger svg file, the result is a single black shape. Maybe you could look over it.
I filed http://efxclipse.org/trac/ticket/79 and will take a look – I know I implemented polygone support after I released 0.0.12 so maybe it is already implemented in the git-repo but I’ll check it out.
ok – i found the reason – I’m not inheriting the attributes from the g-container – I’ve started fixing this and it will be part of the next release
Thanks a lot for your converter.
We have a big floor plan in SVG and converted it to fxml. Everything looks fine except for a few small shapes which are missing in the fxml-file. Other similar shapes are correctly converted. I don’t see the difference. You may want to have a look on it.
I’ve extracted only the main thing from the floor plan.
Have you also thought about preserving the IDs from svg?
I’ll try to take a look. I’m currently at EclipseCon and aferwards on holiday so it might take some time. I’ve created a ticket at http://efxclipse.org/trac/ticket/100
On first sight is it looks like the problem is that the converter sets the fill and stroke fills to transparent instead of black but i need to dig deeper and test more
Hello, nice converter you have there. Can this be used in code like adding a .jar API that I reference to my JavaFX project?
Or I can only use it with Eclipse / or commandline?
Providing it as a standalone utility and allowing it to get embedded into applications is on my todo list but I’ve not yet had time to do so. http://efxclipse.org/trac/ticket/91. Eclipse also simply invokes the Java-API, OSGi is not required by the stuff used.
Please note that the converter is not optimized for live scene building if you want to use it for that. In theory you need the following jars:
Let me see what I can do for you on the weekend.
There’s now a standalone jar available. You can get it from https://tomsondev.bestsolution.at/2012/08/22/svg-to-fxml-converter-as-commandline-util/. You can see how the API looks like in https://github.com/tomsontom/e-fx-clipse/blob/master/at.bestsolution.efxclipse.formats.svg/src/at/bestsolution/efxclipse/formats/svg/SVGToFXML.java. The jar repackages all dependencies so take care that you are not running into jar-Hell e.g. because you use another version of guava!
Hi Tom, great work with the converter :-)! I tried to convert the brilliant svg (css) flags from https://github.com/lipis/flag-icon-css. Unfortunately not all flags can be converted – e.g. https://github.com/lipis/flag-icon-css/blob/master/flags/4×3/ae.svg doesn’t convert, Do you have any idea why not?
feel free to file a bug report at https://bugs.eclipse.org/bugs/enter_bug.cgi?product=Efxclipse