Using stylesheets right

Question

Hi guys,
for a GUI i wanted to use a stylesheet to save code but i have some questions in how to use it.
1. Is it possible to make elements position flexible? So if i expand the scene the element will still be at xpos = 10% of Scene size or something like that.
2. I want to change the style of a slider. It should be like a Progressbar so everything in the track which is at the left side of the thumb should be in another color than the right side.
3. How can i set a background picture for the whole scene? I use some Panes which i add to a Group, which is given to the Scene. but if i want to change the background color i have to make it in every Pane. things like .scene{...} or .group{...} do not work. I have to configure it in every Pane but then it is not seen if i expand the scene.
Thanks for your attention ;)

Answer 1

Hi,
i have tried to make my layout run but i still have some problems. For auto scaling my ui i use different kinds of pane to organize the positioning. But the alligment is not correct.
I use this code:
set_buttonicons();
        //write bars on the spectrum pane
        for (int i=0; i<BAND_NUMBER; i++)
            band_spectrum.relocate(20+(10*i), 35);
title_label.relocate(20, 10);
Pane controll_buttons = new Pane();
controll_buttons.getChildren().addAll(backward_button,play_button,forward_button,stop_button);
backward_button.relocate(0, 20);
play_button.relocate(40, 20);
forward_button.relocate(85, 20);
stop_button.relocate(135, 27);
controll_buttons.setMinSize(150, 30);
GridPane settings_buttons = new GridPane();
settings_buttons.setAlignment(Pos.CENTER);
settings_buttons.setHgap(20);
settings_buttons.setVgap(20);
settings_buttons.setPadding(new Insets(0, 10, 0, 10));
settings_buttons.add(equalizer_button,0,0);
settings_buttons.add(mute_button,1,0);
settings_buttons.add(repeat_button,0,1);
settings_buttons.add(random_button,1,1);
//settings_buttons.setMaxWidth(150);
FlowPane settings = new FlowPane();
settings.setAlignment(Pos.CENTER);
settings.getChildren().addAll(settings_buttons,volume_slider);
spectrum.getChildren().addAll(title_label);
spectrum.getChildren().addAll(band_spectrum);
BorderPane header_layout = new BorderPane();
header_layout.setLeft(controll_buttons);
header_layout.setCenter(spectrum);
header_layout.setRight(settings);
BorderPane.setAlignment(controll_buttons, Pos.CENTER_LEFT);
BorderPane.setAlignment(spectrum, Pos.CENTER);
BorderPane.setAlignment(settings, Pos.CENTER_RIGHT);
I you can imagine how this should work out :) On the header there are buttungs which have a special shape and have to be next to each other. That is why i relocate them manually. The next pane should be the Audiospectrum where are shown. Last spectrum is with 4 rectagular positioned buttons and a slider to the left or under the buttons. The left pane should allways be on the left border of the scene. the spectrum pane allways in the middle and the last pane should allways be at the right border of the pane.
But the spectrum is just moving in a very small space and the right pane is not at the right side of the scene. Can someone please tell me, where my error is? I also tried a HBox with regions between the panes. nearly the same result.