Javafx2.2 creating scroll bar with transparent background

Question

I am trying to make a scrollpane with a scrollbar that has a transparent (or at least solid) background, by styling it with css in javafx 2.2.3.

.scroll-pane .track{-fx-opacity: 0;} .scroll-pane .scroll-bar{-fx-base: transparent;} 

Strange, the code above makes a black scrollbar. Providing -fx-base of any value with alfa does this.

Background color has no effect ...

What am I missing?

Answer 1

Here is an example that displays a scroll bar with a transparent background.

The sample includes some additional programming logic to display visual feedback on the scroll bar when the user hovers over the scroll bar — you may or may not need it.

css associated with scrollbar in sample:

 .address .scroll-pane { -fx-background-color: transparent; } .address .scroll-bar .increment-button { visibility: hidden; } .address .scroll-bar .decrement-button { visibility: hidden; } .address .scroll-bar:vertical { -fx-background-color: transparent; } .address .scroll-bar:vertical .track-background { visibility: hidden; } .address .scroll-bar:vertical .track { visibility: hidden; } .address .hide-thumb .scroll-bar:vertical .thumb { -fx-background-color: transparent; } 

If the transparent scrollbar has an additional custom style class assigned to it.

I decided to use css by examining the default CSS2 stylesheet scrollbar section for JavaFX 2.2 caspian.css .

Sample Output: