FX Experience Has Gone Read-Only

I've been maintaining FX Experience for a really long time now, and I love hearing from people who enjoy my weekly links roundup. One thing I've noticed recently is that maintaining two sites (FX Experience and JonathanGiles.net) takes more time than ideal, and splits the audience up. Therefore, FX Experience will become read-only for new blog posts, but weekly posts will continue to be published on JonathanGiles.net. If you follow @FXExperience on Twitter, I suggest you also follow @JonathanGiles. This is not the end - just a consolidation of my online presence to make my life a little easier!

tl;dr: Follow me on Twitter and check for the latest news on JonathanGiles.net.

Hi everyone. I’ve been meaning to get more interviews out for quite some time, but as you know work is often all-consuming! 🙂 Anyway, today I am pleased to post this catch-up with Tom Schindl about his work on a styled text editor for JavaFX. Next week I will be following this interview up with another interview, this time with Felipe Heidrich, an Oracle engineer who works on text in JavaFX (including the rich text APIs Tom mentioned below and native text rendering). Previously he was very closely involved with Eclipse and SWT, so he has a wealth of knowledge in the Java desktop area. Anyway, for today let’s get back to Tom! Enjoy 🙂

Hi Tom, I’ve already interviewed you in the past, but today I wanted to talk to you about your latest work around styled text editing in JavaFX. Could you please summarise what exactly it is you’ve been working on?
In the last week I’ve been working on a StyledTextArea (Blog 1, Blog 2, Blog 3). Developers interact with such a control day by day when using their favorite IDE – in my case Eclipse.

If someone one day wants to write a purely JavaFX driven IDE, the source code editor is certainly the most important control. In JavaFX 2 it was very hard to implement a control like this and the only feasible solution was to use WebView and use one of the sourcecode editors written in JavaScript. And as a matter of fact, one can really get quite far with it (See my blog entry about mixing and matching JDT and JavaFX).

JavaFX 8 introduces a new scenegraph element named “TextFlow” that helps with the layout of Text nodes and so writing such a control has become much easier than it was in JavaFX 2.x. One of my main goals is to have a control that has an API comparable to the widget used within Eclipse. The reason for that is that if the widget works similar to the SWT one,  almost everything provided by the Eclipse text parsing and styling infrastructure can be reused almost unmodified (only replace things like SWT-Color, Font by their JavaFX counterparts and you are done).

That sounds really cool – it’s something I’ve heard a lot of people have been wanting in JavaFX! How did you implement this?
I’ve started with a very naive implementation where I simply used the Eclipse-Text-infrastructure to partition (e.g. code parts, javadoc parts) and tokenize (e.g. keywords,…) and created one TextFlow and many Text nodes below it. While this naive implementation would have been suffcient for viewing sourcecode (with the limitation of big files rendering quite slowly), it could not be used for editing because the complete TextLayout had to be recalculated on each keystroke!

The solution is to go “virtual”, so that only the layout of the currently visible lines has to be recalculated when the text within is changed. The nice thing with this is approach is that one does not have to implement virtual support from scratch because controls like ListView, TableView, etc are virtual already.

For my use case, ListView is the perfect match: each line in the sourcefile is represented by one Line object and then added to the list. The ListCell simply sets a TextFlow with Text nodes as its graphic property. Customizing the CSS a bit to remove alternating line colors and a better suited highlight color are the final steps so that nobody recognizes you are presenting a ListView to the user.

In the screenshot below, on the left you see the unstyled editor, so you’ll recognize it is a ListView. The right side shows the same with modified CSS styling.

Styled text demo

From a high-level perspective the whole system works like this:

architecture

The internal logic to deal with the style-range is a shameless copy from the SWT StyledText control.

What do you have planned for the control in the future?
The first thing that I have to do is to finish the control’s internals. Currently it only works for the above setup but not in a much simpler one, where you don’t make use of the Eclipse Text infrastructure.

There also other very basic features not implemented yet, like text selection and other similar things My next priority is to get the widget connected to source code parsers.

There are 2 showcases I have in mind:

  • Hook up into Eclipse JDT (quite simple because I already know exactly how this works)
  • Use the parser provided by the Nashorn project to come up with a minimal JavaScript editor that marks errors and has  basic auto-completion.

How can people get ahold of this control?
The sources and samples are part of e(fx)clipse github repository. The easiest way to get started is to get one of our prepackaged Eclipse distros from http://efxclipse.org and clone the mentioned git-repository. The nice thing about this stuff is that besides depending on some general Eclipse components (the text parsing infrastructure), it doesn’t depend on anything special – it does not even need to be run in OSGi.

Do you intend to try and contribute this control back to the OpenJFX project?
As much as I’d love to contribute it to OpenJFX,  I will be unable to do so because  inside the control I reused code licensed under the EPL. Generally speaking this does not cause a problem for people using it in their project, but I can’t simply relicense and provide it under the GPL used by OpenJFX. If someone is interested in doing a clean room implementation of the EPL code, I have no problem contributing it!

You’ve contributed a lot of patches to OpenJFX development already. What motivates you to do this and do you recommend that other people join in?
I’m an autodidact (I never studied computer sience) and I discovered very early that instead of reading books on frameworks it is much better for me checking out the source and learn from the sourcecode. While digging through a new unknown code base to understand it, I start fixing uncritical things like compiler warnings and provide those to the developers.

The other reason I contribute stuff is, that I require certain unavailable features to advance the frameworks and applications I’m building myself. Software development and opensource software development in particular is a give-and-take where you don’t exchange money but trade work instead. If you only take, you probably won’t get much back. On the other hand, if your “trade partner”  recognizes that you are not only taking stuff but giving something back, the next time you need something he feels much more compelled to provide it to you in a shorter time. It’s simply like it is in real life!

I can only recommend anyone to contribute back and I hope for example that the people who requested the iOS/Android code from Oracle to be open sourced, put their money (=work) where their mouth has been.

I think the biggest hurdle at present is getting a local build of OpenJFX – how do you do this? (Note: Richard Bair is currently working on improved building support for OpenJFX, so this shouldn’t be a problem for much longer)
I’m currently not producing local builds. I’ve install the weekly JDK8 builds from http://jdk8.java.net/ and have the OpenJFX master checked out in my Eclipse workspace to produce patches and run the Junit test suite.

Thanks so much for your time Tom!