Tips & Tricks

New Custom Control: TaskProgressView

I have written a new custom control and commited it to the ControlsFX project. It is a highly specialized control for showing a list of background tasks, their current status and progress. This is actually the first control I have written for ControlsFX just for the fun of it, meaning I do not have a use case for it myself (but sure one will come eventually). The screenshot below shows the control in action. If you are already familiar with the javafx.concurrent.Task class you will quickly grasp that the control shows the value of its title, message, and progress properties. [...]

By |2021-02-18T13:42:30+01:00October 13th, 2014|ControlsFX, JavaFX, Tips & Tricks|9 Comments

JavaFX Tip 14: StackPane Children – Hidden But Not Gone

Another short tip: Swing provides a layout manager called CardLayout, which manages a set of components (cards) inside a container but always only shows one of them. The method CardLayout.show(Container, String) allows to switch between the components / the cards. The same behaviour can be accomplished in JavaFX by using the StackPane, adding several children (each using the entire width and height of the pane) and calling the Node.toFront() method to switch between the children. However, there is one big difference: the StackPane will always layout all of its children, independent of wether they are currently showing or not. This [...]

By |2014-08-19T09:43:09+02:00August 19th, 2014|JavaFX, Tips & Tricks|5 Comments

JavaFX Tip 13: Study Modena CSS File

This is the easiest and shortest tip so far. If you want to do any of the following things: learn how to use CSS make your custom controls look like the standard controls reuse an SVG path graphic used by a standard control (e.g. scrollbar arrows) figure out how to navigate the structure of the standard controls determine the color used for a specific item consistently modify several standard controls then simply take a look at the default CSS stylesheet that ships with JavaFX. The file is called modena.css and can be found in the jfxrt.jar file in this location: com/sun/javafx/scene/control/skin/modena/

By |2014-08-19T09:09:38+02:00August 19th, 2014|JavaFX, Tips & Tricks|3 Comments

JavaFX Tip 12: Define Icons in CSS

When you are a UI developer coming from Swing like me then there is a good chance that you are still setting images / icons directly in your code. Most likely something like this: import javafx.scene.control.Label; import javafx.scene.image.ImageView; public class MyLabel extends Label { public MyLabel() { setGraphic(new ImageView(MyLabel.class. getResource("image.gif").toExternalForm())); } } In this example the image file is looked up via Class.getResource(), the URL is passed to the constructor of the ImageView node and this node is set as the "graphic" property on the label. This approach works perfectly well but with JavaFX there is a more [...]

By |2021-02-18T13:42:30+01:00July 22nd, 2014|Java, JavaFX, Tips & Tricks|6 Comments

JavaFX Tip 11: Updating Read-Only Properties

Custom controls often feature "read-only" properties. This means that they can not be set from outside the control, not even from their own skin class. It is often the behaviour of a control that leads to a change of the read-only property. In JavaFX this behaviour can be implemented in the control itself and in the skin. So we sometimes end up with a skin wanting to update a read-only property of the control. How can this be done? Backdoor: Property Map The solution is quite simple: use the properties map of the control as a backdoor to the control class. [...]

By |2021-02-18T13:42:30+01:00July 18th, 2014|JavaFX, Tips & Tricks|0 Comments

JavaFX Tip 10: Custom Composite Controls

Writing custom controls in JavaFX is a simple and straight forward process. A control class is needed for controlling the state of the control (hence the name). A skin class is needed for the apperance of the control. And more often than not a CSS file for customizing the apperance. A common approach for controls is to hide the nodes they are using inside their skin class. The TextField control for example uses two instances of javafx.scene.text.Text. One for the regular text, one for the prompt text. These nodes are not accessible via the TextField API. If you want to get a [...]

By |2021-02-18T13:42:30+01:00July 18th, 2014|ControlsFX, Java, JavaFX, Tips & Tricks|4 Comments

JavaFX Tip 9: Do Not Mix Swing / JavaFX

The JavaFX team has tried very hard to convince us that migrating from Swing to JavaFX is easy because of the option to embed Swing content in a JavaFX UI and vice versa. I must admit that I never tried it myself but based on the feedback I am getting from my customers I can only recommend to not mix Swing and JavaFX. At the time of this writing there were over 200 unresolved issues (120+ bugs) related to Swing integration (registered with the JavaFX issue management system). Issue Types The following is a list of issues that you might encounter [...]

By |2021-02-18T13:42:30+01:00July 17th, 2014|Java, JavaFX, Tips & Tricks|4 Comments

JavaFX Tip 8: Beauty is Skin Deep

If you are developing a UI framework for JavaFX, then please make it a habit to always split your custom controls into a control class and a skin class. Coming from Swing myself this was not obvious to me right away. Swing also uses an MVC concept and delegates the actual component rendering to a UI delegate, but people extending Swing mostly subclassed one of its controls and added extensions / modifications to the subclass. Only very few frameworks actually worked with the UI delegates (e.g. MacWidgets). I have the luxury of being able to compare the implementation of [...]

By |2021-02-18T13:42:30+01:00July 14th, 2014|FlexGantt, Java, JavaFX, Tips & Tricks|2 Comments

JavaFX Tip 7: Use CSS Color Constants / Derive Colors

When working on FlexCalendarFX I got to the point where I had to define a set of colors to visualize the controls for different calendars in different colors. And not just one color per calendar but several: a background and a text color for deselected / selected / hover states. The  colors were used in several places but for the sake of brevity I only focus on the visual calendar entries in the day view of FlexCalendarFX. The two screenshots below show the same entry, first deselected, then selected. What is important to notice is that these are not completely different [...]

By |2021-02-18T13:42:30+01:00July 11th, 2014|FlexGantt, Java, JavaFX, Tips & Tricks|4 Comments

JavaFX Tip 6: Use Transparent Colors

Picking the right colors for your user interface elements is always a great challenge, but it is even more challenging when you develop reusable framework controls where you as a developer have no control over the look and feel of the application using them. While you might always add elements on top of the default gray background the developers embedding your controls  might have more of a gothic tendency and use a black background. All of a sudden the nice colors your picked clash with the rest of the application. To tackle this problem the best way I found while working on FlexGanttFX and FlexCalendarFX [...]

By |2021-02-18T13:42:31+01:00July 11th, 2014|FlexGantt, Java, JavaFX, Tips & Tricks|2 Comments