JavaFX: Hide Slider/Divider of the SplitPane

Question

I have a JavaFX application with a SplitPane . I want do hide the Slider/Divider of SplitPane . How can I do this?

Greetings from Germany (so sorry for my english)

Julian

Answer 1

Its a little different in Java FX8 (modena style):

.split-pane *.split-pane-divider {
    -fx-padding: 0 1 0 1;
}

Answer 2

In caspian.css, you will see

/* horizontal the two nodes are placed to the left/right of each other. */
.split-pane:horizontal > * > .split-pane-divider {
   -fx-border-color: transparent -fx-box-border transparent #BBBBBB;
   -fx-background-color: transparent, -fx-inner-border-horizontal;
   -fx-background-insets: 0, 0 1 0 1;
}

/* vertical the two nodes are placed on top of each other. */
.split-pane:vertical > * > .split-pane-divider {
   -fx-border-color:  #BBBBBB transparent -fx-box-border transparent;
   -fx-background-color: transparent, -fx-inner-border;
   -fx-background-insets: 0, 1 0 1 0;
}

I am using a vertical one, so I overrided the vertical one in my css as following:

.split-pane:vertical > * > .split-pane-divider {
   -fx-border-color:  transparent;
   -fx-background-color: transparent;
   -fx-background-insets: 0;
}

And it works. If you want to hide the grabbers too (eg I did not hide it, it seems nice), I think the following rule might do the trick:

.split-pane *.vertical-grabber {
    -fx-padding: 0;
    -fx-background-color: transparent;
    -fx-background-insets: 0;
    -fx-shape: " ";
}

I hope it helps.

Answer 3

These other answers still left a thin gray bar so in my CSS I added:

.split-pane-divider {
   -fx-background-color: transparent;
}

Answer 4

Another Note:

The divider appears between the children in the Split Pane's list of items. If your split pane only has one item in it, you won't see a divider. If your split pane has 3 items, you will see 2 dividers. If you need to get rid of a divider, you may not need an item in the split pane at all . So just remove the item from the Split Pane's list of items temporarily.

Answer 5

Late, but this is how to do it correctly instead of working around it using CSS:

for (Node node : splitPane.lookupAll(".split-pane-divider")) {
    node.setVisible(false);
}

Answer 6

SplitPane.Divider doesn't inherit from Node , therefore it hasn't a disableProperty .

If you need to have a split pane to be resized JUST from the code, you can skin the divider through CSS to be invisible and with a size near 0.

Otherwise use AnchorPane 's nested into a VBox