JAVAFX - Adding Nodes To TitledPane's Header - layout

I want to add nodes into the TitledPane's header. The only way I found to do it is using setGraphic() method.
The problem of using that way is I cannot place them neatly. Here is what I get:
The Codes
TitledPane tpane = new TitledPane();
tpane.setContent(new Text("Content"));
tpane.setExpanded(false);
Button b = new Button("Delete");
BorderPane box = new BorderPane();
box.setLeft(new Text("1 "));
box.setCenter(new Text("Single Pane"));
box.setRight(b);
AnchorPane par = new AnchorPane(box);
tpane.setGraphic(par);
VBox vbox = new VBox();
vbox.getChildren().add(tpane);
The Goal
I want to put the Delete button to the right, that's why I am using Borderpane. So the BorderPane need to fill the entire of the TitledPane's header width minus the space for small triangle
How can it be done inside setGraphic() method? Or are there any better way to achieve it?

To fix your problem try setting the width of the BorderPane to the width of the scene minus the arrow like this.
TitledPane tpane = new TitledPane();
tpane.setContent(new Text("Content"));
tpane.setExpanded(false);
Button b = new Button("Delete");
BorderPane box = new BorderPane();
box.setLeft(new Text("1 "));
box.setCenter(new Text("Single Pane"));
box.setRight(b);
AnchorPane par = new AnchorPane(box);
tpane.setGraphic(par);
VBox vbox = new VBox();
vbox.getChildren().add(tpane);
box.setPrefWidth(scene.getWidth()-30);//You can adjust the number to fit your needs and change scene to whatever the name of your scene is
I hope this helped

Well, it seems that support for javafx users is not as massive as the mainstream framework.
After some tries by the suggestion from #Austin, I found the way to do what I want, and this is also give dynamic sizing.
box.prefWidthProperty().bind(scene.widthProperty().subtract(35));
TitledPane tpane = new TitledPane();
tpane.setContent(new Text("Content"));
tpane.setExpanded(false);
Button b = new Button("Delete");
BorderPane box = new BorderPane();
box.setLeft(new Text("1 "));
box.setCenter(new Text("Single Pane"));
box.setRight(b);
tpane.setGraphic(box);
box.prefWidthProperty().bind(scene.widthProperty().subtract(35));
VBox vbox = new VBox();
vbox.getChildren().add(tpane);

Related

JavaFX Menu Flow

I have an application with two menu bars (application menus and administration menus) on the top row and a search box in between them. The first menu bar is left justified with the search box immediately following while the second menu is right justified. This leaves room for additional application menus without moving the administration menus.
I tried an HBox, but can't get the second menu right justfied.
I tried using an AnchorPane and anchoring the application menu to the left and the admin menu to the right. This works fine until you resize it. When the display gets too small to show both menus it starts truncating letters. I want it to wrap the second menu to the next line.
I tried using a FlowPane which works great for getting one to flow under the other when resized, but I can't get the second menu reliable right justified. I tried a trick of putting a listener on the parent width and calculating the hgap to use, but the first time this gets called, the menu bars have a size of 0 and so the hgap is too big for the actual menus. After I resize it once, that trick works beautifully.
Even better would be a menuBar that could flow automatically so that I didn't have to break it up to allow it to wrap around. But if that capability exists, I've been unable to find it.
AFAIK MenuBar does not support wrapping its Menus.
There can be different approaches to achieve the layout you want. One of them at the below.
To align the second admin flowPane to the right, use HBox.setHgrow for flowPane. To align menu bars in flowPane, use flow.setAlignment(Pos.TOP_RIGHT):
#Override
public void start(Stage primaryStage) {
final Menu menu01 = new Menu("App Menu 1");
final Menu menu02 = new Menu("App Menu 2");
final Menu menu1 = new Menu("Admin Menu 1");
final Menu menu2 = new Menu("Admin Menu 2");
final Menu menu3 = new Menu("Admin Menu 3");
MenuBar menuBar0 = new MenuBar();
menuBar0.getMenus().addAll(menu01, menu02);
menuBar0.setMinWidth(220); // do not shrink
MenuBar menuBar1 = new MenuBar();
menuBar1.getMenus().addAll(menu1);
MenuBar menuBar2 = new MenuBar();
menuBar2.getMenus().addAll(menu2);
MenuBar menuBar3 = new MenuBar();
menuBar3.getMenus().addAll(menu3);
FlowPane flow = new FlowPane(Orientation.HORIZONTAL);
// flow.setStyle("-fx-background-color: gray; -fx-border-color: red"); // visual debug
flow.setAlignment(Pos.TOP_RIGHT);
flow.setHgap(0);
flow.getChildren().addAll(menuBar1, menuBar2, menuBar3);
TextField searchField = new TextField();
searchField.setPromptText("Search here..");
// make it unresizable
searchField.setMinWidth(200);
searchField.setMaxWidth(200);
HBox mainBox = new HBox(5);
mainBox.setAlignment(Pos.CENTER_LEFT);
HBox.setHgrow(flow, Priority.ALWAYS);
mainBox.getChildren().addAll(menuBar0, searchField, flow);
mainBox.setStyle("-fx-background-color: lightgray;");
VBox vBox = new VBox(0);
vBox.getChildren().addAll(mainBox, new Button("Demo"));
Scene scene = new Scene(vBox);
primaryStage.setScene(scene);
primaryStage.show();
}

Align textView next to another one programatically

I am programmatically creating a text view and trying to place another textView right next to the first one. But I am unable to do it.
Here is the code I have written,
//1st textview
TextView itemText = new TextView(context);
itemText.setText(mItemText);
Typeface itemFont = Typeface.createFromAsset(context.getAssets(), "fonts/" + "Roboto" + ".ttf");
itemText.setTypeface(itemFont,Typeface.BOLD);
itemText.setPadding(0, padding, 0, 0);
itemText.setId(10);
RelativeLayout.LayoutParams itemTextParams = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.MATCH_PARENT,
RelativeLayout.LayoutParams.MATCH_PARENT);
itemTextParams.addRule(RelativeLayout.ALIGN_PARENT_TOP);
itemTextParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
itemText.setTextSize(font_size);
itemText.setLayoutParams(itemTextParams);
//2nd text view
TextView seperator = new TextView(context);
seperator.setText(mSeperator);
seperator.setPadding(0,padding,0,0);
seperator.setTypeface(null,Typeface.BOLD);
RelativeLayout.LayoutParams seperatorParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
seperatorParams.addRule(RelativeLayout.ALIGN_PARENT_TOP);
seperatorParams.addRule(RelativeLayout.RIGHT_OF,itemText.getId());
seperatorParams.addRule(RelativeLayout.CENTER_VERTICAL);
seperator.setLayoutParams(seperatorParams);
seperatorParams.addRule(RelativeLayout.CENTER_HORIZONTAL) works, but when I use seperatorParams.addRule(RelativeLayout.RIGHT_OF,itemText.getId()) , the text is not shown.
Can anyone point out where I am going wrong? Or is there any other way to do this?
The width of itemTextParams is set to MATCH_PARENT, so there's no space to put anything to the right of it. Change it to WRAP_CONTENT or define a width value.

Set BorderPane components size

I want to set the size of the Center, Top, Left, Right and Bottom components of a BorderPane.
So far I found this:
BorderPane() mainpane = new BorderPane();
mainPane.getBottom().prefWidth(sizeX);
For example how I can you get the size of a Left side of a BorderPane and set the size?
the "Left" of a BorderPane is whatever you set it to and it's size is whatever you set it to.
example:
BorderPane mainpane = new BorderPane();
StackPane left = new StackPane();
left.setPrefWidth(100);
mainPane.setLeft(left);

JavaFX scene builder questions

I'm working with JavaFX scene builder and have two questions.
Fisrt one:"How to add border to Pane in JavaFX scene builder?"
Second one: "How to split cells in HBox?"
I dont know why you would want to join HBox cells as you can set the resize behaviour for every child of the hbox.
There is a example in HBox's Javadoc:
//For example, if an hbox needs the TextField to be allocated all extra space:
HBox hbox = new HBox();
TextField field = new TextField();
HBox.setHgrow(field, Priority.ALWAYS);
hbox.getChildren().addAll(new Label("Search:"), field, new Button("Go"));
Joining cells would be possible in a GridPane with the row- and/or columnSpan.
GridPane gridpane = new GridPane();
gridpane.add(new Button(), 0, 0, 2, 2); // column=0 row=0, spans over 2 columns and 2 rows
gridpane.add(new Label(), 3, 1); // column=3 row=1 (spans over 1 column and 1 row (default))
row-/columnSpan and the vertical horizontal Grow can be specified in the Properties bar of the Scene Builder, residing on the right side, by default.
You can set border by using setStyle() and use some styles like -fx-border
examples
P.S. styles are the same, as like css, but with -fx- prefix

How to set tabs position in JavaFX

I have this JavaFX code with tabs. Can you tell me how I can set the position of the tabs panel to be always on the left side of the main stage:
VBox stackedTitledPanes = createStackedTitledPanes();
ScrollPane scroll = makeScrollable(stackedTitledPanes);
TabPane tabPane = new TabPane();
BorderPane mainPane = new BorderPane();
tabPane.setStyle("-fx-font-size: 12pt;"); // Set global size for the font
// Create Tabs
Tab tabA = new Tab();
tabA.setText("Main Component");
tabA.setStyle("-fx-font-size: 12pt;"); // Set size of the tab name
// Add something in Tab
StackPane tabA_stack = new StackPane();
tabA_stack.setAlignment(Pos.CENTER);
tabA_stack.getChildren().add(scroll);
tabA.setContent(tabA_stack);
tabPane.getTabs().add(tabA);
Tab tabB = new Tab();
tabB.setText("Second Component");
tabB.setStyle("-fx-font-size: 12pt;"); // Set size of the tab name
// Add something in Tab
StackPane tabB_stack = new StackPane();
tabB_stack.setAlignment(Pos.CENTER);
tabB_stack.getChildren().add(new Label("Label#Tab B"));
tabB.setContent(tabB_stack);
tabPane.getTabs().add(tabB);
Tab tabC = new Tab();
tabC.setText("Last Component");
tabC.setStyle("-fx-font-size: 12pt;"); // Set size of the tab name
// Add something in Tab
StackPane tabC_vBox = new StackPane();
tabC_vBox.setAlignment(Pos.CENTER);
tabC_vBox.getChildren().add(new Label("Label#Tab C"));
tabC.setContent(tabC_vBox);
tabPane.getTabs().add(tabC);
mainPane.setCenter(tabPane);
mainPane.setPrefSize(395, 580);
mainPane.setLayoutX(850);
mainPane.setLayoutY(32);
scroll.setPrefSize(395, 580);
scroll.setLayoutX(850);
scroll.setLayoutY(32);
root.getChildren().add(mainPane);
Update
Sounds like you want to change your stackedTitledPane from a VBox to a BorderPane.
So this code:
VBox stackedTitledPanes = new VBox();
becomes:
BorderPane stackedTitledPanes = new BorderPane();
Then when you want to add your nodes, you specify which section you want to put them (I put a label in the center pane as a filler):
stackedTitledPanes.setLeft(mainPane);
stackedTitledPanes.setCenter(new Label("Main Content"));
Old answer
This will put the tabs on the left (I'm assuming this is what you're looking for):
tabPane.setSide(Side.LEFT);

Resources