Carolina Waizani
Carolina Waizani

Reputation: 23

How to add padding between TitledPanes in an Accordion in JavaFX

I would like to add padding between TitledPanes in an Accordion (spacing in Accordion).

The problem is that, when a TitledPane is expanded, the look and feel of the next TitledPane is broken.

TitledPanes unexpanded

enter image description here

One TitledPane expanded

enter image description here

I have used the following CSS:

.titled-pane {
    -fx-skin: "com.sun.javafx.scene.control.skin.TitledPaneSkin";    
    -fx-text-fill: -fx-text-base-color;
    -fx-padding: 0.5em;
}

One image show the separation between 2 TitledPanes unexpanded, and another image show the look an feel of the second TitledPane after open the first one.

Upvotes: 2

Views: 1531

Answers (1)

DVarga
DVarga

Reputation: 21799

It's a bug (I've created a bug report: JDK-8162599).

As a workaround, if you specify only the bottom padding of TitledPanes (rather than the top), the spacing between TitledPanes in the Accordion is correct.

CSS to add bottom padding

.accordion > .titled-pane {
    -fx-padding: 0 0 0.5em 0;
}

An example Accordion looks like this:

enter image description here

Upvotes: 1

Related Questions