JavaFX BorderPane right side all height - javafx

Is it possible to make right side of BorderPane to have height of window and bottom/top sides then end with the beginning of right side?

AFAIK there is no way to do this, but you can achieve the desired result using a GridPane
private static void setBackground(Region region, Color color) {
region.setBackground(new Background(new BackgroundFill(color, CornerRadii.EMPTY, Insets.EMPTY)));
}
#Override
public void start(Stage primaryStage) {
GridPane gridPane = new GridPane();
RowConstraints rConstranits1 = new RowConstraints();
rConstranits1.setVgrow(Priority.NEVER);
RowConstraints rConstranits2 = new RowConstraints();
rConstranits2.setVgrow(Priority.ALWAYS);
RowConstraints rConstranits3 = new RowConstraints();
rConstranits3.setVgrow(Priority.NEVER);
ColumnConstraints cConstraints1 = new ColumnConstraints();
cConstraints1.setHgrow(Priority.NEVER);
ColumnConstraints cConstraints2 = new ColumnConstraints();
cConstraints2.setHgrow(Priority.ALWAYS);
ColumnConstraints cConstraints3 = new ColumnConstraints();
cConstraints3.setHgrow(Priority.NEVER);
gridPane.getColumnConstraints().addAll(cConstraints1, cConstraints2, cConstraints3);
gridPane.getRowConstraints().addAll(rConstranits1, rConstranits2, rConstranits3);
Region top = new Region();
top.setPrefSize(300, 100);
setBackground(top, Color.RED);
Region bottom = new Region();
bottom.setPrefSize(400, 50);
setBackground(bottom, Color.YELLOW);
Region center = new Region();
setBackground(center, Color.BLUE);
Region right = new Region();
setBackground(right, Color.LIME);
right.setPrefSize(200, 500);
Region left = new Region();
setBackground(left, Color.BROWN);
left.setPrefSize(200, 400);
gridPane.add(right, 2, 0, 1, 3);
cConstraints3.maxWidthProperty().bind(right.prefWidthProperty());
cConstraints3.minWidthProperty().bind(right.prefWidthProperty());
gridPane.add(top, 0, 0, 2, 1);
rConstranits1.minHeightProperty().bind(top.prefHeightProperty());
rConstranits1.maxHeightProperty().bind(top.prefHeightProperty());
gridPane.add(bottom, 0, 2, 2, 1);
rConstranits3.minHeightProperty().bind(bottom.prefHeightProperty());
rConstranits3.maxHeightProperty().bind(bottom.prefHeightProperty());
gridPane.add(center, 1, 1);
gridPane.add(left, 0, 1);
cConstraints1.minWidthProperty().bind(left.prefWidthProperty());
cConstraints1.maxWidthProperty().bind(left.prefWidthProperty());
Scene scene = new Scene(gridPane);
primaryStage.setScene(scene);
primaryStage.show();
}

Nesting two BorderPanes is another option, which then relies on BorderPane's built in height & width management. Credit to fabian for the example basis and setBackground routine!
private static void setBackground(Region region, Color color) {
region.setBackground(new Background(new BackgroundFill(color, CornerRadii.EMPTY, Insets.EMPTY)));
}
#Override
public void start(Stage primaryStage) {
BorderPane outer = new BorderPane();
BorderPane inner = new BorderPane();
Region top = new Region();
top.setPrefSize(300, 300);
setBackground(top, Color.RED);
Region bottom = new Region();
bottom.setPrefSize(400, 200);
setBackground(bottom, Color.YELLOW);
Region right = new Region();
setBackground(right, Color.BLUE);
right.setPrefSize(200, 500);
inner.setCenter(top);
inner.setBottom(bottom);
outer.setCenter(inner);
outer.setRight(right);
Scene s = new Scene(outer);
primaryStage.setScene(s);
primaryStage.show();
}

Related

Dynamically resizing and repositioning of buttons in GridPane

I am trying to create a window consisting of a left pane and a right pane included in a GridPane layout. I am drawing the bounding box of this two widgets and I can see that they are resizing when the main window of the application is resized. In the left pane a GridPane layout is used to add Buttons. While the left pane resizes properly the buttons inside the left pane do not resize and reposition once the left pane resizes. The complete code is listed below. Can anyone help ?
public class PlanesJavaFxApplication extends Application {
static class ToolbarPane extends Pane
{
public ToolbarPane() {
final HBox hbox = new HBox(5);
hbox.getChildren().add(new Text("TOP"));
this.getChildren().add(hbox);
}
}
static class LeftPane extends Pane
{
public LeftPane() {
final GridPane gridPane = new GridPane();
ColumnConstraints col1 = new ColumnConstraints();
col1.setPercentWidth(33);
ColumnConstraints col2 = new ColumnConstraints();
col2.setPercentWidth(33);
ColumnConstraints col3 = new ColumnConstraints();
col3.setPercentWidth(33);
gridPane.getColumnConstraints().addAll(col1, col2, col3);
Button selectButton = new Button("Select");
Button rotateButton = new Button("Rotate");
Button upButton = new Button("Up");
Button leftButton = new Button("Left");
Button rightButton = new Button("Right");
Button downButton = new Button("Down");
Button doneButton = new Button("Done");
gridPane.add(selectButton, 1, 0);
gridPane.add(rotateButton, 1, 1);
gridPane.add(upButton, 1, 2);
gridPane.add(leftButton, 0, 3);
gridPane.add(rightButton, 2, 3);
gridPane.add(downButton, 1, 4);
gridPane.add(doneButton, 1, 5);
//gridPane.prefWidth(300);
this.getChildren().add(gridPane);
}
}
static class RightPane extends Pane
{
public RightPane() {
final HBox hbox = new HBox(5);
hbox.getChildren().add(new Text("RIGHT"));
this.getChildren().add(hbox);
}
}
public static void main(String[] args) {
launch(args);
}
#Override
public void start(Stage stage) throws Exception {
// TODO Auto-generated method stub
final GridPane gridPane = new GridPane();
ColumnConstraints col1 = new ColumnConstraints();
col1.setPercentWidth(40);
ColumnConstraints col2 = new ColumnConstraints();
col2.setPercentWidth(60);
gridPane.getColumnConstraints().addAll(col1, col2);
Pane leftPane = new LeftPane();
leftPane.setStyle("-fx-border-color: red");
Pane rightPane = new RightPane();
rightPane.setStyle("-fx-border-color: blue");
gridPane.add(leftPane, 0, 0);
gridPane.add(rightPane, 1, 0);
stage.setScene(new Scene(gridPane));
stage.show();
}
}
Simply add a binding between your LeftPane and your GridPane as below into LeftPane (at the end of the class):
static class LeftPane extends Pane {
public LeftPane() {
final GridPane gridPane = new GridPane();
ColumnConstraints col1 = new ColumnConstraints();
col1.setPercentWidth(33);
ColumnConstraints col2 = new ColumnConstraints();
col2.setPercentWidth(33);
ColumnConstraints col3 = new ColumnConstraints();
col3.setPercentWidth(33);
gridPane.getColumnConstraints().addAll(col1, col2, col3);
Button selectButton = new Button("Select");
Button rotateButton = new Button("Rotate");
Button upButton = new Button("Up");
Button leftButton = new Button("Left");
Button rightButton = new Button("Right");
Button downButton = new Button("Down");
Button doneButton = new Button("Done");
gridPane.add(selectButton, 1, 0);
gridPane.add(rotateButton, 1, 1);
gridPane.add(upButton, 1, 2);
gridPane.add(leftButton, 0, 3);
gridPane.add(rightButton, 2, 3);
gridPane.add(downButton, 1, 4);
gridPane.add(doneButton, 1, 5);
// In order to see the GridPane extends with the LeftPane, remove it further
gridPane.setGridLinesVisible(true);
// Those 2 following lines enable the gridpane to stretch/shrink according the LeftPane
gridPane.prefWidthProperty().bind(this.widthProperty());
gridPane.prefHeightProperty().bind(this.heightProperty());
//gridPane.prefWidth(300);
this.getChildren().add(gridPane);
}
}
You can also center your buttons for a better effect (GridPane.setValignment(Node pNode, VPos pVPos) and GridPane.setHalignment(Node pNode, HPos pHPos).
Some remarks (not applicable if the code you posted is an MCVE/SSCCE) :
Use FXML files as much as possible for a cleaner code
LeftPane could directly extends GridPane instead of Pane (in this case)
Based on your code, the problem is that the gridpane which hosts the buttons never changes it's shape. You need to add constraints and listeners to that gridpane as well.
here's an example:
public class PlanesJavaFxApplication extends Application {
static class ToolbarPane extends Pane {
public ToolbarPane() {
final HBox hbox = new HBox(5);
hbox.getChildren().add(new Text("TOP"));
this.getChildren().add(hbox);
}
}
static Button upButton = new Button("Up");
static class LeftPane extends Pane {
public LeftPane() {
final GridPane gridPane = new GridPane();
ColumnConstraints col1 = new ColumnConstraints();
col1.setPercentWidth(33);
ColumnConstraints col2 = new ColumnConstraints();
col2.setPercentWidth(33);
ColumnConstraints col3 = new ColumnConstraints();
col3.setPercentWidth(33);
gridPane.getColumnConstraints().addAll(col1, col2, col3);
Button selectButton = new Button("Select");
Button rotateButton = new Button("Rotate");
Button leftButton = new Button("Left");
Button rightButton = new Button("Right");
Button downButton = new Button("Down");
Button doneButton = new Button("Done");
gridPane.add(selectButton, 1, 0);
gridPane.add(rotateButton, 1, 1);
gridPane.add(upButton, 1, 2);
gridPane.add(leftButton, 0, 3);
gridPane.add(rightButton, 2, 3);
gridPane.add(downButton, 1, 4);
gridPane.add(doneButton, 1, 5);
//gridPane.prefWidth(300);
this.getChildren().add(gridPane);
}
}
static class RightPane extends Pane {
public RightPane() {
final HBox hbox = new HBox(5);
hbox.getChildren().add(new Text("RIGHT"));
this.getChildren().add(hbox);
}
}
public static void main(String[] args) {
launch(args);
}
#Override
public void start(Stage stage) throws Exception {
// TODO Auto-generated method stub
final GridPane gridPane = new GridPane();
gridPane.setGridLinesVisible(true);
ColumnConstraints col1 = new ColumnConstraints();
col1.setPercentWidth(40);
ColumnConstraints col2 = new ColumnConstraints();
col2.setPercentWidth(60);
gridPane.getColumnConstraints().addAll(col1, col2);
Pane leftPane = new LeftPane();
leftPane.setStyle("-fx-border-color: red");
Pane rightPane = new RightPane();
rightPane.setStyle("-fx-border-color: blue");
stage.widthProperty().addListener((observable, oldValue, newValue) -> {
upButton.setPrefWidth(newValue.doubleValue() > oldValue.doubleValue() ? upButton.getWidth() + 5 : upButton.getWidth() - 5);
});
gridPane.add(leftPane, 0, 0);
gridPane.add(rightPane, 1, 0);
stage.setScene(new Scene(gridPane));
stage.show();
}
}

java fx titled border can not resolve

i found topics with similar theme, but i couldn't resolve my issue.i have a small code for gui but i can not make my window to have that border and title in the smae line. the closest i got was border and just bellow title.Here is my code:
public class NumberAddition extends Application {
BorderedTitledPane root;
GridPane pane = new GridPane();
#Override
public void start(Stage primaryStage) {
Label first_lbl = new Label("First number: ");
pane.setConstraints(first_lbl, 0, 0);
Label second_lbl = new Label("Second number: ");
pane.setConstraints(second_lbl, 0, 1);
Label third_lbl = new Label("Result: ");
pane.setConstraints(third_lbl, 0, 2);
Button btn = new Button();
btn.setText("Add");
btn.setMinWidth(70);
Button btn_1 = new Button();
btn_1.setText("Clear");
btn_1.setMinWidth(70);
Button btn_2 = new Button();
btn_2.setText("Exit");
TextField txt_1 = new TextField();
txt_1.setPrefWidth(200);
pane.setConstraints(txt_1, 1, 0);
TextField txt_2 = new TextField();
txt_2.setPrefWidth(200);
pane.setConstraints(txt_2, 1, 1);
TextField txt_3 = new TextField();
txt_3.setPrefWidth(200);
pane.setConstraints(txt_3, 1, 2);
HBox box = new HBox();
pane.setConstraints(box, 1, 4);
box.setPadding(new Insets(5, 50, 5, 50));
box.setSpacing(50);
box.getChildren().addAll(btn, btn_1);
root = new BorderedTitledPane("Number addition");
root.setPadding(new Insets(20, 20, 20, 20));
root.getStylesheets().add(getClass().getResource("bordered-titled-title.css").toExternalForm());
root.getChildren().add(pane);
pane.setPadding(new Insets(20, 20, 20, 20));
pane.setVgap(5);
pane.setHgap(5);
pane.getChildren().addAll(first_lbl, txt_1, second_lbl, txt_2, third_lbl, txt_3, box);
// root.getChildren().add(btn);
Scene scene = new Scene(root, 450, 250);
primaryStage.setScene(scene);
primaryStage.show();
}
/**
* #param args the command line arguments
*/
public static void main(String[] args) {
launch(args);
}
}
public class BorderedTitledPane extends StackPane{
BorderedTitledPane(String titleString) {
Label title = new Label(" " + titleString + " ");
title.getStyleClass().add("bordered-titled-title");
StackPane.setAlignment(title, Pos.TOP_LEFT);
getStyleClass().add("bordered-titled-border");
this.getChildren().addAll(title);
}
}
and css:
.label {
-fx-font: 12px sans-serif;
}
.bordered-titled-title {
-fx-background-color: white;
-fx-translate-y: -16;
}
.bordered-titled-border {
-fx-content-display: top;
-fx-border-insets: 20 15 15 15;
-fx-background-color: white;
-fx-border-color: black;
-fx-border-width: 2;
}
.bordered-titled-content {
-fx-padding: 26 10 10 10;
}
Use this way
public class NumberAddition extends Application {
GridPane pane = new GridPane();
#SuppressWarnings("static-access")
#Override
public void start(Stage primaryStage) {
Label first_lbl = new Label("First number: ");
pane.setConstraints(first_lbl, 0, 0);
Label second_lbl = new Label("Second number: ");
pane.setConstraints(second_lbl, 0, 1);
Label third_lbl = new Label("Result: ");
pane.setConstraints(third_lbl, 0, 2);
Button btn = new Button();
btn.setText("Add");
btn.setMinWidth(70);
Button btn_1 = new Button();
btn_1.setText("Clear");
btn_1.setMinWidth(70);
Button btn_2 = new Button();
btn_2.setText("Exit");
TextField txt_1 = new TextField();
txt_1.setPrefWidth(200);
pane.setConstraints(txt_1, 1, 0);
TextField txt_2 = new TextField();
txt_2.setPrefWidth(200);
pane.setConstraints(txt_2, 1, 1);
TextField txt_3 = new TextField();
txt_3.setPrefWidth(200);
pane.setConstraints(txt_3, 1, 2);
HBox box = new HBox();
pane.setConstraints(box, 1, 4);
box.setPadding(new Insets(5, 50, 5, 50));
box.setSpacing(50);
box.getChildren().addAll(btn, btn_1);
pane.setVgap(5);
pane.setHgap(5);
pane.getChildren().addAll(first_lbl, txt_1, second_lbl, txt_2, third_lbl, txt_3, box);
final String TITLE = "Number addition";
Pane titledContent = new BorderedTitledPane(TITLE, pane);
titledContent.setStyle("-fx-content-display: top;" + "-fx-border-insets: 20 15 15 15;"
+ "-fx-background-color: #eff1f4;" + "-fx-border-color: black;" + "-fx-border-width: 0.5;");
titledContent.setPrefSize(pane.getMaxWidth(), pane.getMaxHeight());
Scene scene = new Scene(titledContent);
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
class BorderedTitledPane extends StackPane {
BorderedTitledPane(String titleString, Node content) {
Label title = new Label(" " + titleString + " ");
title.setStyle("-fx-background-color: #eff1f4;" + "-fx-translate-y: -10;");
title.setFont(Font.font(null, FontWeight.BOLD, 14));
StackPane.setAlignment(title, Pos.TOP_CENTER);
StackPane contentPane = new StackPane();
content.setStyle("-fx-padding: 20 5 5 5;");
contentPane.getChildren().add(content);
getChildren().addAll(title, contentPane);
}
}
}

Some nodes won't appear in HBox

I am working on a Yahtzee game just to develop my programming skills and I can't seem to get all the Labels and Radio Buttons to appear in the HBox. Here is all the relevant code:
public class Main extends Application{
Label diceRoll1 = new Label("1");
Label diceRoll2 = new Label("2");
Label diceRoll3 = new Label("3");
Label diceRoll4 = new Label("4");
Label diceRoll5 = new Label("5");
RadioButton holdRButton1 = new RadioButton("Hold");
RadioButton holdRButton2 = new RadioButton("Hold");
RadioButton holdRButton3 = new RadioButton("Hold");
RadioButton holdRButton4 = new RadioButton("Hold");
RadioButton holdRButton5 = new RadioButton("Hold");
Button rollDice = new Button("Roll!");
Stage window;
public static void main(String[] args) {
launch(args);
}
#Override
public void start(Stage primaryStage)throws Exception{
VBox diceRoll1Layout = new VBox(5);
diceRoll1Layout.getChildren().addAll(diceRoll1, holdRButton1);
VBox diceRoll2Layout = new VBox(5);
diceRoll2Layout.getChildren().addAll(diceRoll2, holdRButton2);
VBox diceRoll3Layout = new VBox(5);
diceRoll3Layout.getChildren().addAll(diceRoll3, holdRButton3);
VBox diceRoll4Layout = new VBox(5);
diceRoll4Layout.getChildren().addAll(diceRoll4, holdRButton4);
VBox diceRoll5Layout = new VBox(5);
diceRoll5Layout.getChildren().addAll(diceRoll5, holdRButton5);
HBox diceRolls = new HBox(5);
diceRolls.getChildren().addAll(diceRoll1Layout,diceRoll2Layout,diceRoll3Layout,
diceRoll4Layout,diceRoll5Layout, rollDice);
BorderPane rootPane = new BorderPane();
rootPane.setBottom(diceRolls);
Scene scene = new Scene(rootPane, 400, 500);
window = primaryStage;
window.setTitle("Yahtzee!");
window.setScene(scene);
window.show();
}
}
But for some reason whenever I run the code only diceRoll1, diceRoll2, holdRButton1, holdRButton2 and rollDice appear in the window. They're all coded the same so I don't know why they don't all appear. I tried setting them to visible and it made no difference. Am I missing something?

javafx TabPane show search field in the default dropddown showing hidden tabs

How to set search field for the default drop down on the tab pane in JavaFX ,which shows hidden tab list. and here is my code for tabs on the Tabpane
public void start(Stage primaryStage) {
primaryStage.setTitle("Tabs");
Group root = new Group();
Scene scene = new Scene(root, 400, 250, Color.WHITE);
TabPane tabPane = new TabPane();
BorderPane borderPane = new BorderPane();
for (int i = 0; i < 10; i++) {
Tab tab = new Tab();
tab.setText("Tab" + i);
HBox hbox = new HBox();
hbox.getChildren().add(new Label("Tab" + i));
hbox.setAlignment(Pos.CENTER);
tab.setContent(hbox);
tabPane.getTabs().add(tab);
}
// bind to take available space
borderPane.prefHeightProperty().bind(scene.heightProperty());
borderPane.prefWidthProperty().bind(scene.widthProperty());
borderPane.setCenter(tabPane);
root.getChildren().add(borderPane);
primaryStage.setScene(scene);
primaryStage.show();
}

How can the text of the label be shown?

As you can see in the picture, the label in the third box, next to the ComboBox, has the text '...' instead of 'fase'.
I have previously attempted to increase the size of the HBox in which it resides, increasing spacing, but to no avail. Any suggestions?
public void start(Stage primaryStage) {
RadioButtonCustom inhoud = new RadioButtonCustom();
Fieldset fs = new Fieldset("eerste", inhoud);
RadioButtonCustom inhoud2 = new RadioButtonCustom();
Fieldset fs2 = new Fieldset("tweede", inhoud2);
//error
HBox hb = new HBox();
hb.minWidth(200);
Label fase = new Label("fase");
fase.setText("Fase");
fase.minWidth(500);
fase.getStyleClass().add("bordered-titled-title");
StackPane.setAlignment(fase, Pos.CENTER);
ComboBox<Integer> cb = new ComboBox<>();
hb.setSpacing(40);
for (Integer i : array) {
cb.getItems().add(i);
}
hb.getChildren().addAll(fase,cb);
Fieldset fs3 = new Fieldset("fase",hb);
// einde error
VBox vb = new VBox();
vb.getChildren().addAll(fs, fs2,fs3);
vb.setSpacing(20);
Button btn = new Button();
btn.setText("Say 'Hello World'");
btn.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
System.out.println("Hello World!");
}
});
BorderPane root = new BorderPane();
root.getChildren().add(vb);
Scene scene = new Scene(root, 500, 500);
scene.getStylesheets().add("/lissa/stijl.css");
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
}

Resources