Develop Reference

how to achieve resizability in javafx?

I have an AncharPane in which all components are placed/designed using Fxml but the problem is, when the frame resize all components are stick with its current position.

With AnchorPane, you can't get automatic resizing unless you have to resize your views one by one in the controller/code.
If you want autoresize, use BorderPane, VBox or HBox.

If you're using scene builder you can achieve this by selecting the component you'd like to make resizable, then go under layout and set the constraints.
You can also achieve this in your Controller class like this:
AnchorPane.setTopAnchor(yourTextField, 35);
AnchorPane.setLeftAnchor(yourTextField, 27);
AnchorPane.setRightAnchor(yourTextField, 120);
I used a TextField for this example, but you can do it with other components.

If the AnchorPane has a border and padding set, the offsets will be measured from the inside edge of those insets.
To autoresize I recommend BorderPane. You can also use VBox and HBox to organize you Scene.

Javafx 3D disapear in split pane

I developed a 3d plotting tool (so-called A; which is a subscene). I want to put this subscene in a Split Pane (B). The problem is a part of my scene disappears (when I rotate the plot some parts appear). as you can see below:
trauncated plot
However; when I use HBox or Pane instead of SplitPane, everything works well.
the code is here(I simplified it for better understanding)
SplitPane splitPane = FXMLLoader.load(getClass().getResource("sample.fxml"));
Scene scene =new Scene(splitPane);
Pane pane = new HBox();
pane.getChildren().add(A);
splitPane.getItems().add(pane);
primaryStage.setScene(scene);

I solve it. It is a little bit tricky but in the subcode of sub-scene A; I use Stackpane as a root. I changed it to Group. everything works well.

JFX scale image up and down to parent

I am attempting to have an ImageView that scales with its parent. I have searched through every StackOverflow post I can find on this, and here is what I've tried:
taggedImage.setPreserveRatio(true);
//taggedImage.fitWidthProperty().bind(
// Bindings.min(imagePane.widthProperty(), imagePane.widthProperty()));
//taggedImage.fitHeightProperty().bind(
// Bindings.min(imagePane.heightProperty(), imagePane.heightProperty()));
taggedImage.fitWidthProperty().bind(imagePane.widthProperty());
taggedImage.fitHeightProperty().bind(imagePane.heightProperty());
The commented lines I tried as well and the issue with these approaches is that when the imageview binds to the parent, the parent can only scale up and not down. Therefore, if you increase the size of the window, the picture will get bigger. If you decrease the size of the picture again, it doesn't decrease the picture size. In this example, imagePane is a StackPane. I have also tried a borderFrame. As well, I've tried using a Pane as the parent. This way, the image successfully scales up and down. However, the image isnt centered and is always in the top left corner of the pane if it doesnt match the size of the pane exactly.
Scene Tree:
https://gyazo.com/45e0daebbfd98dfd3446185d21eb91ee
Values:
Top gridpane:
https://gyazo.com/f48ebb39f48d876a02d44792a73eaad4
lower level gridpane:
https://gyazo.com/3399d9f3ab00e8babd36ee3b0e3b27ba
BorderPane:
https://gyazo.com/51c24f8de50ae3865a299fdddf3a1490
ImageView:
https://gyazo.com/7dfc1071d2b516a83baed301596be2b9
Note, here I'm trying it with a borderpane instead of what I was using before. However, the result is the same no matter which object is the parent of the imageview.

Solved. I've been messing around and found a fix. This isn't exactly intuitive but it worked for me: I left the image inside the borderframe and, in the java code, I created a pane in the same part of the gridpane as the image. I then bound the imageview's width and height to the pane. Then, the centering of the image was correct as well as the scaling.
Here is what i did:
imageView.setPreserveRatio(true);
Pane pane = new Pane();
testGridPane.add(pane, 1, 1);
imageView.fitWidthProperty().bind(pane.widthProperty());
imageView.fitHeightProperty().bind(pane.heightProperty());

placement of dynamically added buttons in javafx

I have dynamically created a bunch of buttons. I gave a fixed width to each of them. I want it to be added until space is available to its parents and when it overlaps with some other nodes, it will automatically go to the next line in order to avoid collision. I want it to be responsive at different screen sizes.
for(Data i:datas){
Button btn=new Button(i.getName());
anchorPane.getChildren().addAll(btn);
}
I want to arrange the buttons in a new line only when the buttons in the first line have covered its total width. How can I accomplish it? Any help is appreciated.

James_D provided a great resource—there's a built in layout for anything you need and FlowPane has what you want here.
Using your example, just swap out your AnchorPane for FlowPane:
FlowPane flowPane = new FlowPane();
for(Data i:datas){
Button btn=new Button(i.getName());
flowPane.getChildren().addAll(btn);
}
To make it responsive (i.e. expand and contract with the parent container/stage), bind the FlowPane's width and height to those of its parent:
flowPane.prefWidthProperty().bind(stage.widthProperty());
flowPane.prefHeightProperty().bind(stage.heightProperty());

How to keep JavaFX MenuBar in the top part of the window

I'm trying to make an window, where I have StackPane as root and I want to add MenuBar to this window. However MenuBar is in the center of the screen and I want to keep it in the top part of the window as in normal Windows applications.
root = new StackPane();
root.getChildren().add(new MenuBar());
this will show window like this
http://i61.tinypic.com/2pzblmo.jpg
Thanks you for your advice!

I would say StackPane is not suitable for making a GUI including a menubar.
StackPane will just put the controls you add to it one on top of the other.
In java docs you can find:
"StackPane
The StackPane layout pane places all of the nodes within a single stack with each new node added on top of the previous node. This layout model provides an easy way to overlay text on a shape or image or to overlap common shapes to create a complex shape. Figure 1-6 shows a help icon that is created by stacking a question mark on top of a rectangle with a gradient background.
"