How to change header component in TitledPane in JavaFX

Viewed 31576

I cannot find an answer about this anywhere on the internet.

I have an application that has to have collapsable panels, so the TitledPane and Accordion set-up in Java FX is a natural candidate.

In the application, I need to have custom headers for the container when it's collapsed. I see in the css document for the TitledPane that the header is really an HBox and a variety of other components.

http://docs.oracle.com/javafx/2/api/javafx/scene/doc-files/cssref.html#titledpane

I would like to access this component and replace it with a custom component.

I have been using the TitledPane api's setGraphic function and setContentDisplay to GraphicOnly. with a custom component. However, I cannot get it to render correctly. I've had issues with removing the arrow, and removing the space occupied by the arrow.

See the link below for screenshots of the desired look and how it actually looks.

http://tinypic.com/r/s1pxfn/6

How does one remove the arrow and remove the padding?

4 Answers

In the present day at the end of 2018 nothing of these solutions works with JavaFX of JDK 1.8. So I've working on a simple solution. You can copy this method in and utility class:

public static boolean hideArrow(TitledPane pane) {
    Node arrowButton = pane.lookup(".arrow-button");
    if (arrowButton == null) {
        return false;
    }
    // I don't know how with this the arrow space disappears...., but it does
    arrowButton.setStyle("-fx-background-color: black;");
    Parent titleRegion = arrowButton.getParent();
    titleRegion.addEventFilter(MouseEvent.ANY, MouseEvent::consume);
    titleRegion.setCursor(Cursor.DEFAULT);
    ((StackPane) titleRegion).getChildren().remove(arrowButton);
    return true;
}
Related