I have a problem situating my scene on center in VBox Layout.
I use Border Layout as main, and Vbox is a child of Border Layout.
Any advice is appriciated, thanks!
VBox vbox = new VBox();
Scene scenehbox = new Scene(vbox, 200, 200);
vbox.setStyle("-fx-background-color:DIMGREY");
vbox.getChildren().addAll(username, txuser, password, txpassword, btn1);
primaryStage.setResizable(false); //settings
primaryStage.setScene(scene);
primaryStage.setTitle("ROXXY");
root.setStyle("-fx-background-color:DIMGREY");
root.getChildren().addAll(poly, poly2, poly3, poly4, text, vbox);
vbox.setAlignment(Pos.CENTER);
primaryStage.show();
public static void main(String[] args) {
launch(args);
}
I think your content is centered. It's just your VBox is growing just enough to contain your elements, therefore you cannot notice the elements being centered on it because there's no space left to be centered on.
Try to set the values of height/width of your VBox or bind them to the size of another element if that's what you are looking for.
Related
I am new to java fx. I am creating a basic GUI which is meant to look like this:
However, when I try my image looks like this:
I am unsure as to why there is a large gap between the two buttons. I am using the grid pane format.
Here is my code:
public class Main extends Application {
#Override
public void start(Stage stage) {
//Creating Text field
TextField textField1 = new TextField();
//Creating Buttons
Button submit = new Button("Submit");
Button cancel = new Button("Cancel");
//Creating a Grid Pane
GridPane gridPane = new GridPane();
//Setting size for the pane
gridPane.setMinSize(200, 100);
//Setting the padding
gridPane.setPadding(new Insets(10, 10, 10, 10));
//Setting the vertical and horizontal gaps between the columns
gridPane.setVgap(5);
gridPane.setHgap(1);
//Setting the Grid alignment
gridPane.setAlignment(Pos.CENTER);
//Arranging all the nodes in the grid
gridPane.add(textField1, 0, 0);
gridPane.add(submit, 0, 1);
gridPane.add(cancel, 1,1);
//Creating a scene object
Scene scene = new Scene(gridPane);
//Setting title to the Stage
stage.setTitle("Simple Form");
//Adding scene to the stage
stage.setScene(scene);
//Displaying the contents of the stage
stage.show();
}
public static void main(String args[]){
launch(args);
}
}
Help would be appreciated :-)
What happens here is that your TextField is set in the top-left corner (0,0), but only spans a single column. You can see that the cancel Button, which is in the bottom right corner (1,1), starts where the TextField stops (if you look only at the x-position).
There is a debug option for GridPanes so you can visualize more what happens. Just call
gridPane.setGridLinesVisible(true):
The solution for this is to set the TextField to obtain/span 2 columns. You can do so by either calling:
GridPane.setColumnSpan(textField1, 2);
Or use a different add method:
gridPane.add(textField1, 0, 0, 2, 1);
See https://docs.oracle.com/javase/8/javafx/api/javafx/scene/layout/GridPane.html for more information about how the GridPane works.
I want to have StackPane as my root pane. I want to have a scrollPane as a small box in the middle of the scene and two buttons below the container.
I tried to make it happen by writing this code:
private StackPane root = new StackPane();
private Scene scene = new Scene(root, 1366, 768);
public ContinueScreen() {
Button button1 = new ButtonBuilder("My Button1").setPrefWidth(200).build();
Button button2 = new ButtonBuilder("My Button2").setPrefWidth(200).build();
Button button3 = new ButtonBuilder("My Button3").setPrefWidth(200).build();
Button button4 = new ButtonBuilder("My Button4").setPrefWidth(200).build();
Button button5 = new ButtonBuilder("My Button5").setPrefWidth(200).build();
Button button6 = new ButtonBuilder("My Button6").setPrefWidth(200).build();
VBox vBox = new VBox(5);
vBox.getChildren().addAll(button1, button2, button3, button4, button5, button6);
ScrollPane scrollPane = new ScrollPane();
scrollPane.setContent(vBox);
scrollPane.setPannable(true);
scrollPane.setMaxSize(500, 180);
scrollPane.setVbarPolicy(ScrollPane.ScrollBarPolicy.ALWAYS);
scrollPane.setHbarPolicy(ScrollPane.ScrollBarPolicy.AS_NEEDED);
root.getChildren().add(scrollPane);
StackPane.setAlignment(scrollPane, Pos.CENTER);
}
As you can probably notice, the code does work perfectly fine but that is until I add the buttons below I was talking about. I added those buttons in an HBox as
HBox hBox = new HBox(5);
hBox.setAlignment(Pos.BOTTOM_CENTER);
hBox.getChildren().addAll(new Button("cat"), new Button("dog"));
root.getChildren().addAll(hBox);
Now both the scrollpane and the two buttons are shown. However the scroll pane now stops working for some reason. The scrollpane is shown and its content but the horizontal or the vertical scroll, both of them do not work. Anyone knows why is this happening and how to fix it?
As you are using StackPane as root it piles up the nodes on one another so the top pane is HBox and not the ScrollPane, so it you are not able to use.
Use BorderPane or VBox and try.
BorderPane root = new BorderPane();
Scene scene = new Scene(root, 1366, 768);
root.setCenter(scrollPane);
HBox hBox = new HBox(5);
hBox.getChildren().addAll(new Button("cat"), new Button("dog"));
root.setBottom(hBox);
The issue here is that StackPane is allowed to resize the HBox, which it does. The HBox covers the complete scene preventing mouse events from reaching the ScrollPane. You can easily see this by coloring the HBox:
hBox.setStyle("-fx-background-color: rgba(100%, 0%, 0%, 0.5)");
The most simple solution would be to set up the HBox to only receive events on non-(fully-)transparent areas:
hBox.setPickOnBounds(false);
However you could also set up the HBox to take up the space required to fit the preferred size of the content and do the alignment via the StackPane:
hBox.setPrefSize(Region.USE_COMPUTED_SIZE, Region.USE_COMPUTED_SIZE);
hBox.setMaxSize(Region.USE_PREF_SIZE, Region.USE_PREF_SIZE);
StackPane.setAlignment(hBox, Pos.BOTTOM_CENTER);
// hBox.setAlignment(Pos.BOTTOM_CENTER);
Note that using a StackPane like this does not provide you with a responsive GUI: If you resize the window to a small enough height, the buttons will cover the ScrollPane.
You may have better luck using a BorderPane or wrapping the StackPane and the HBox in a VBox and setting VBox.vgrow to Priority.ALWAYS for the StackPane...
I'm struggling to display text in a simple javafx application, and I'm struggling to see why it's happening. Here's my code:
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception{
//Declarations
Pane root = new Pane();
Scene scene = new Scene(root, 960, 600);
javafx.scene.canvas.Canvas background = new Canvas(3840, 2160);
StackPane infoPane = new StackPane();
Text test = new Text("Hello");
test.setY(500);
test.setX(500);
root.getChildren().add(test);
//Stage Setting
primaryStage.setScene(scene);
primaryStage.setTitle("Test application");
primaryStage.setFullScreen(true);
primaryStage.setFullScreenExitHint("Press escape to exit fullscreen");
primaryStage.show();
//javafx.scene.image.Image icon = new Image("Sample/Test.png");
//primaryStage.getIcons().add(icon);
//Parent and child declarations
infoPane.getChildren().add(test);
//Styling
//Background
StackPane backgroundHolder = new StackPane();
backgroundHolder.setStyle("-fx-background-color: #0053A8");
backgroundHolder.getChildren().add(background);
root.getChildren().add(backgroundHolder);
}
The idea is to have an application with a blue background, that has different text fields on it. Thanks for any and all help!
You add the test node to your root Pane, but then you add it also to infoPane. Since a node can only appear once in the scene graph, you are essentially removing it from the root pane before you can see it.
Note that you never add infoPane to your scene graph.
I suggest you read this tutorial, and maybe try a few simple layouts with Scene Builder.
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);
I have TreeView placed as content of ScrollPane. ScrollPane is placed inside SplitPane.
When I drag divider of SplitPane so that it becomes bigger than TreeView size I see border of TreeView.
I want TreeView to be resized as much as space is available after I drag divider of SplitPane. My code:
SplitPane splitPane = new SplitPane();
splitPane.getItems().addAll(createTreeOfConnections());
private ScrollPane createTreeOfConnections() {
ScrollPane scrollPane = new ScrollPane();
scrollPane.setMinSize(100, 300);
scrollPane.setPrefSize(200, 500);
scrollPane.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
scrollPane.setVbarPolicy(ScrollBarPolicy.AS_NEEDED);
scrollPane.setHbarPolicy(ScrollBarPolicy.AS_NEEDED);
scrollPane.setContent(new ConnectionsTree(this));
return scrollPane;
Class ConnectionsTree extends TreeView and its constructor is :
public ConnectionsTree(MainStage mainStage) {
// here we set the root of ConnectionsTree which is not visible
super();
this.mainStage = mainStage;
root = new ConnectionTreeItem();
root.setExpanded(true);
super.setRoot(root);
super.setShowRoot(false);
super.setEditable(false);
super.getSelectionModel().setSelectionMode(SelectionMode.SINGLE);
super.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
retrieveExistentConnectionsNodes();
ContextMenu contextMenu = new ContextMenu(createNewConnectionMenuItem(
"New Connection", KeyCombination.valueOf("Ctrl+N")));
super.setContextMenu(contextMenu); }
How to tell TreeView(my TreeConnections) that it should take all available space of left part of SplitPane?
Thank you!
Try this
scrollPane.setFitToHeight(true);
scrollPane.setFitToWidth(true);