Develop Reference

Changing stage width/height then switching scene does not update the UI in the new scene

I have two scenes A and B and a stage.
If I'm in scene A, and change the stage width / height, it will update the UI to scale it to the new stage dimensions.
However if from there I switch to scene B, the UI in scene B will not be updated till I force a update by doing something like resizing the screen or opening and closing the stage.
Is there a way to update all scenes when the stage width / height is changed? Since only one scene can be set to the stage at one time the current changes are not applying automatically to all scenes.
Here's a minimal reproduced example.
#Override
public void start(Stage stage) throws Exception {
stage.setWidth(400);
stage.setHeight(400);
Scene scene1, scene2;
BorderPane layout1 = new BorderPane();
Button buttontosecond = new Button("go to second page");
layout1.setCenter(buttontosecond);
scene1 = new Scene(layout1, stage.getWidth(), stage.getHeight());
BorderPane layout2 = new BorderPane();
Button buttonsize = new Button("change size");
Button buttontomain = new Button("back to main");
VBox vbox = new VBox(buttonsize, buttontomain);
vbox.setAlignment(Pos.CENTER);
layout2.setCenter(vbox);
scene2 = new Scene(layout2, stage.getWidth(), stage.getHeight());
buttontomain.setOnAction(actionEvent -> {stage.setScene(scene1);});
buttontosecond.setOnAction(actionEvent -> {stage.setScene(scene2);});
buttonsize.setOnAction(actionEvent -> {stage.setWidth(200);stage.setHeight(200);});
stage.setScene(scene1);
stage.show();
}

DO not do scene switching in this way. Instead implement a single scene root-switching system as shown in the answer to this post. I did not manage to get the code above to work, but I found that the reason for this was my dual monitor setup. When dragging the game window into the other monitor it worked fine.

How do you combine two scenes into one scene?

Is there a way to combine two javaFx scenes into one scene (then assign that scene to a stage) or, assign two scenes to a stage simultaneously so they are side by side on a stage.
Aim: I have a scene that shows a calculator, I have a scene that shows a clock. I want to have them side by side (calculator on left, clock on right) on the same stage (without using scene builder).
Any help would be appreciated.

yes you can do this in javafx with subscenes,
a subscene is like a scene that can be added into layouts
you can do something like this
#Override
public void start(Stage primaryStage) throws Exception {
StackPane layoutOne = new StackPane();
Label labelOne = new Label("One");
layoutOne.getChildren().add(labelOne);
SubScene subSceneOne = new SubScene(layoutOne,300,100);
StackPane layoutTwo = new StackPane();
Label labelTwo = new Label("Two");
layoutTwo.getChildren().add(labelTwo);
SubScene subSceneTwo = new SubScene(layoutTwo,300,100);
VBox root = new VBox(10);
root.setAlignment(Pos.CENTER);
root.getChildren().addAll(subSceneOne,subSceneTwo);
Scene mainScene = new Scene(root,300,210);
primaryStage.setScene(mainScene);
primaryStage.show();
}
hope this what you were looking for, you can also check this for more

Java FX, switching scenes messes up node alignment of second scene?

Im working on a java FX application were I switch between my start up scene, startScreen() and my game play scene, create(). I have looked at multiple tutorials on how to switch scenes to make sure I had the right idea, and it seems simple enough.
However, if I start the application with the create() scene the format and alignment of all the nodes within are fine. If I try to start with the startScreen() scene and then switch to the create() using the action event, the alignment of the nodes in the game play scene gets messed up (the boards shift and the labels are placed on top of the boards). As far as I've seen in tutorials, switching scenes shouldn't affect the alignment of nodes of scenes assuming the scenes normally work separately.
Original (just calling create()) and Second Version calling both startScreen() and create()
public Parent create() {
BorderPane root = new BorderPane();
root.setPrefSize(800, 800);
setButtons(root);
enemy = new Board(event -> {...}, true);
player = new Board(event -> {...}, false);
VBox vbox = new VBox(50, enemyLabel, enemy, playerLabel, player);
vbox.setAlignment(Pos.CENTER);
root.setCenter(vbox);
return root;
}
public Parent startScreen(Stage primaryStage) {
BorderPane pane = new BorderPane();
pane.setPrefSize(800, 800);
pane.setId("pane");
Button button = new Button("START");
button.setOnAction(e-> primaryStage.setScene(new Scene(create())));
pane.setCenter(button);
return pane;
}
#Override
public void start(Stage primaryStage) {
try {
primaryStage.setTitle("Boat Wars");
primaryStage.setResizable(false);
//Scene scene = new Scene(startScreen(primaryStage));
//scene.getStylesheets().addAll(this.getClass().getResource("application.css").toExternalForm());
Scene scene = new Scene(create());
primaryStage.setScene(scene);
primaryStage.show();
} catch (Exception e) {
e.printStackTrace();
}
}

How To Use CSS For JavaFX Projects

I am quite new to JavaFX and was wondering if there is a way to assign a css file to the entire JavaFX project/scene. Currently, I have to apply the stylesheet to every element I want to be styled with css. I am working with IntelliJ and Scene Builder 2.0. I have tried adding the stylesheets in my Main class, start method as shown below but it did not seem to have the desired effect.
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception {
Parent root = FXMLLoader.load(getClass().getResource("JavaFXTest.fxml"));
primaryStage.setTitle("JavaFX Test");
primaryStage.setScene(new Scene(root, 300, 275));
root.getStylesheets().add("#../styling/styles.css");
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}

I realized that it was a problem with the path to the css file. I changed it to:
root.getStylesheets().add("styling/styles.css");
and achieved the desired results. This way I do not need to manually add the stylesheet to every element in the UI, rather it works across the entire scene now. Just declare your classes/id's as per normal css convention to add styling.

You can add a style sheet to the scene:
public void start(Stage primaryStage) {
Button btn = new Button();
btn.setText("Say 'Hello World'");
btn.setOnAction(event -> System.out.println("Hello World!"));
StackPane root = new StackPane();
root.getChildren().add(btn);
Scene scene = new Scene(root, 300, 250);
scene.getStylesheets().add("/styling/styles.css");
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
}
In the above example the style sheet is located at /styling/styles.css relative to the source root.

JavaFX Have multiple Panes in one scene?

I am trying to make an application which will have a date at the top (always automatically centered) and content at the bottom which is not going to be aligned to any direction.
I figured the best way to do this would be to have:
Pane normalLayout = new Pane();
StackPane centeredLayout = new Stackpane();
Label centeredText = new Label("I want this text centered!");
Button unorganizedButton = new Button("Press me");
centeredLayout.getChildren().add(centeredText);
normalLayout.getChildren().add(unorganizedButton);
But then I can't do something like:
Scene myScene = new Scene(centeredLayout, normalLayout, 500, 500);
Window myWindow = new Window();
myWindow.setScene(myScene);
myWindow.show();
So how can this be done? How can multiple panes exist on the same scene?

The Scene it self can only have one root Pane.
So if you want 2 panes in the Scene you need 3.
Scene
|
V
Root Pane (Vbox for example)
| |
V V
Pane1 Pane2
In your code this can look like this:
StackPane rootPane = new StackPane();
Scene scene = new Scene(rootPane,...);
Pane pane1 = new Pane();
Pane pane2 = new Pane();
rootPane.getChildren().addAll(pane1,pane2);
Depending on how your Application should be layouted you have to choose the right Pane implementations.
As a little Tip to get familiar whit all the Layout Containers try the SceneBuilder Application. http://gluonhq.com/open-source/scene-builder/
Maybe this link will help you understanding how layouting works in JavaFX:
http://docs.oracle.com/javafx/2/scenegraph/jfxpub-scenegraph.htm
https://docs.oracle.com/javafx/2/layout/builtin_layouts.htm

I would suggest you to create a "root"-Pane.
In your case, you could use a BorderPane.
Example:
BorderPane root = new BorderPane();
Label centeredText = new Label("I want this text centered!");
Button unorganizedButton = new Button("Press me");
BorderPane.setAlignment(centeredText, Pos.CENTER);
root.setTop(centeredText);
root.setBottom(unorganizedButton);
Afterwards just call the constructor with the newly created pane.
Scene scene = new Scene(root, 500, 500);
Addition:
You could also just set new panes.
AnchorPane anchorPane = new AnchorPane();
root.setTop(anchorPane);