Skip to Main Content

Java SE (Java Platform, Standard Edition)

Announcement

For appeals, questions and feedback about Oracle Forums, please email oracle-forums-moderators_us@oracle.com. Technical questions should be asked in the appropriate category. Thank you!

I'm having trouble customizing the JavaFX controls.

LoaMar 5 2014

RESUME

There is a time I have been studying the new JavaFX technology, and I've been faced with some barriers in creating custom controls. I learned how to use CSS to customize my controls, and then I came across the case of customizing controls using Skin and SkinBase.

Seen such resources, it was easy to initiate and complete the creation of new controls with visual and specific functionalities. However, personalization, that is, the visual and functional editing of existing controls on JavaFX library becomes somewhat more complicated. In many cases the programmer is forced to use resources that are only available in private packages from Oracle (com.sun ...), which would become a bad practice, resulting in the production of software not maintainable.

Imagine the example where we want to customize the ScrollBar control. It is possible to change its appearance completely using CSS. However, the desire of adding new behaviors to such control involves creating a new Theme from ZERO, without any reuse of ScrollBarSkin, because it is in the private Oracle package. This forces the programmer having to reimplement the logics that have already been implemented, such as the positioning of thumb, the update of values, what happens when you click the track, among many other things. In stubbornness to create a subtype of ScrollBarSkin it is seen that there are many important methods that have been encapsulated as not being overwritten, leaving you to have to compulsorily reimplement the existing logic.

What appears, at least, is that many important components for customizing a control are caged, causing you to have to use a single path to reach them (still limited).

EXAMPLE (from theory to practice)

To illustrate what I mean by this and emphasize in the conclusion of this question in this community, we will briefly try to customize the ScrollBar existing in JavaFX package. My intention is to create a scrollbar to look like this:

LINK1 & LINK2

With regard to the behavior of the scrollbar, while clicking on it’s arrows, they should move a little, returning to their positions when the mouse button is released. When you pass the mouse over the thumb and arrows, they should light up. By clicking in the track or pushing any of our scrollbar arrows, the thumb must moves smoothly, in animated form and not abruptly.

So let's start with our experiment. First, let's create a CSS file that will serve as a definition of some appearances:

scroll-bar-style.css Link

Observing our CSS file, we can see that we chose one of the 3 existing ways to connect our control to our skin, and we use the definition of -fx-skin property in our CSS file. Now we need to link our CSS file created with our control. This is done in Java code where we just have to set the CSS style sheet our control:

scrollBar.getStylesheets().setAll(this.getClass().getResource("scroll-bar-style.css").toExternalForm());

Note: To run the example, you need to have a test class with a main method to create and place a ScrollBar in a scene graph.

We already have our control linked to our Skin, but we have not really created the Skin. Creating or editing controls takes into account that the controls themselves, ie, the objects that extend Control, are considered part of the model of the MVC pattern, existing in JavaFX. The part of the control and visualization is originally divided (do not know for what reason) into two parts. One, called the Skin, and the other, called Behavior. Both are existing interfaces in JavaFX with Skin representing the Visualization part, and Behavior being the part of Control. Unfortunately (do not know why!) Behavior is considered a private part of the JavaFX package, so the users developers of JavaFX are pushed to treat the part of Visualization and Control inside the Skin, which would be the part initially set for Visualization only. Having said all these strange things, let's create our Skin class:

ScrollBarSkin2 Link

As you can see, we insist on creating a subtype of ScrollBarSkin, a private implementation of JavaFX (com.sun ...) package. I also want to make clear that I borrowed the BindableTransition class:

BindableTransition Link

This is a class that I took from AquaFX, so I have no credit for its creation. The original author, as written in the class itself, is hendrikebbers. I want to thank him/her and the AquaFX team for making available the source code, without which I'd be lost.

As you can see, ScrollBarSkin2 has the addEvents method, which is tasked to add certain events to certain components from skin. Largely, the animations are treated there. The heaviest problem of this code appears when I try to make the thumb to move smoothly once the user click on the track, or the arrow buttons. I just could not implement such behavior, because I have no idea how to do it. I've tried to override the handleControlPropertyChanged method (from BehaviorSkinBase), trying to create a proper positionThumb method. Unfortunately this was not possible because I need some ScrollBarSkin properties in order to properly position the thumb. Such properties would be, for example, trackPos and trackLenght, reserved to be calculated and used only in ScrollBarSkin.

CONCLUSION

I can then conclude that I do not know what else to do. It is very annoying that Oracle provide JavaFX technology limiting its use (at least this is what appears). Appears to be no documentation on the study site of JavaFX about more advanced customization. The documents on editing and creating custom controls in JavaFX existing on internet talk about the simple customization via CSS, not mentioning how we can implement more advanced features (such as animation of their substructures) within the skin. It makes me so frustrated, after all I see great potential in this technology (incomparable to Swing) and still not have the ability to use this feature.

At the most, I felt myself powerless not knowing what to do. I wish someone responsible for developing JavaFX and documentation take notion of certain limitations that are appearing to us (to me, at least). The existing books on the subject are completely outdated, and if not, they do not say anything more than the existing content here (also).

QUESTION

I do not know where to turn to talk about these kinds of things, but I would like someone to tell me that I'm customizing my controls in the wrong way, and that I must correct some lines of code for any reason whatsoever. After all, JavaFX 8 will be fully launched on March 18. Someone please tell me what I'm doing wrong. If I am not doing anything wrong, what needs to be done for this to be notified to the developers of JavaFX?

Let me be clear I started this thread here and that does not mean there is an error in the language, or something. Not! It may be that I have no knowledge of how it is possible to perform such an act. I also say this for not wanting to offend anyone, or make anyone waste their time. I know that many are busy and working, and I know who read it loses a bit of time. So I apologize if my questions can be a nuisance.

Thank you for your attention.

EDIT

I just do not understand for what reason the source code I post here is not formatted properly. This is the second time this has happened. I simply copy and paste the code here with the syntax already separated, and yet the result comes out wrong.


EDIT 2

After several failed attempts to edit the formatting of my source code here on the forum, I decided to host my source code on a website and provide the link here for you. I apologize for the inconvenience.

Comments
Locked Post
New comments cannot be posted to this locked post.
Post Details
Locked on Apr 2 2014
Added on Mar 5 2014
0 comments
356 views