JavaFX Panel inside Panel auto resizing

Question

I have a JavaFX application which has only one FXML file  In this file I have one AnchorPane which has a StackPane inside it  Here is the screenshot     When I start this application  I want to resize StackPane automatically with the AnchorPane  Thus  StackPane will get the current avaliable width and height automatically  At the moment when I resize the application  AnchorPane is being resized automatically but StackPane stays as his fixed size   How can I resize the StackPane automatically and make it fully stretched inside its parent panel   My Code  Main java  package app   import javafx application Application  import javafx fxml FXMLLoader  import javafx scene Parent  import javafx scene Scene  import javafx stage Stage   public class Main extends Application      public static void main String   args          Application launch args           Override   public void start Stage stage  throws Exception         Parent root   FXMLLoader load getClass   getResource  Main fxml           Scene scene   new Scene root 800 600         scene getStylesheets   add this getClass   getResource   app style1 css   toExternalForm           stage setScene scene         stage show            MainController java  package app   import java net URL  import java util ResourceBundle  import javafx fxml FXML  import javafx fxml Initializable  import javafx scene layout AnchorPane  import javafx scene layout StackPane   public class MainController implements Initializable        FXML    private AnchorPane anchorPane      FXML    private StackPane stackPane       Override    public void initialize URL url  ResourceBundle rb         stackPane setPrefSize anchorPane getPrefWidth    anchorPane getPrefHeight       didn t work              Main fxml   lt  xml version  1 0  encoding  UTF-8   gt   lt  import java lang    gt   lt  import java util    gt   lt  import javafx scene    gt   lt  import javafx scene control    gt   lt  import javafx scene layout    gt    lt AnchorPane fx id  anchorPane  xmlns fx  http   javafx com fxml  fx controller  app MainController  gt       lt StackPane fx id  stackPane   gt  lt  StackPane gt   lt  AnchorPane gt    style1 css   anchorPane        -fx-border-width  2px      -fx-border-color  chartreuse     stackPane       -fx-border-width  2px      -fx-border-color  red          didn t work       -fx-hgap  100      -fx-vgap  100

User · Answer

It is quite simple because you are using the FXMLBuilder.

Just follow these simple steps:

Open FXML file into FXMLBuilder.
Select the stack pane.
Open the Layout tab [left side tab of FXMLBuilder].
Set the sides value by which you want to compute the pane size during stage resize like TOP, LEFT, RIGHT, BOTTOM.

User · Answer

After hours of searching and testing finally got it just after posting the question   You can use the  AnchorPane topAnchor  AnchorPane bottomAnchor  AnchorPane leftAnchor  AnchorPane rightAnchor  fxml commands with the value  0 0  to fit stretch align the child elements inside a AnchorPane  So  these commands tell to child element to follow its parent while resizing   My updated code Main fxml   lt  xml version  1 0  encoding  UTF-8   gt    lt  import java lang    gt   lt  import java util    gt   lt  import javafx scene    gt   lt  import javafx scene control    gt   lt  import javafx scene layout    gt    lt AnchorPane fx id  anchorPane  xmlns fx  http   javafx com fxml  fx controller  app MainController  gt       lt  -- lt StackPane fx id  stackPane   gt  lt  StackPane gt -- gt   lt  -- replace with the following -- gt       lt StackPane fx id  stackPane  AnchorPane topAnchor  0 0  AnchorPane bottomAnchor  0 0  AnchorPane leftAnchor  0 0  AnchorPane rightAnchor  0 0   gt  lt  StackPane gt   lt  AnchorPane gt    Here is the result     For api documentation  http   docs oracle com javafx 2 api javafx scene layout AnchorPane html

User · Answer

I was designing a GUI in SceneBuilder  trying to make the main container adapt to whatever the window size is  It should always be 100  wide   This is where you can set these values in SceneBuilder     Toggling the dotted red lines will actually just add remove the attributes that Korki posted in his solution  AnchorPane topAnchor etc

User · Answer

No need to cede   just select pane  right click then select Fit to parent    It will automatically resize pane to anchor pane size

User · Answer

Also see here   FXML private void mnuUserLevel onClick ActionEvent event        FXMLLoader loader   new FXMLLoader getClass   getResource  DBedit fxml         loader setController new DBeditEntityUserlevel          try              Node n    Node loader load               AnchorPane setTopAnchor n  0 0              AnchorPane setRightAnchor n  0 0              AnchorPane setLeftAnchor n  0 0              AnchorPane setBottomAnchor n  0 0              mainContent getChildren   setAll n         catch  IOException e              System out println e getMessage               The scenario is to load a child fxml into parent AnchorPane   To make the child to stretch in accords to its parent use AnChorPane setxxxAnchor command

User · Answer

If you are using Scene Builder  you will see at the right an accordion panel which normally has got three options   Properties    Layout  and  Code    In the second one   Layout    you will see an option called   parent layout  Constraints   in your case  AnchorPane Constrainsts     You should put  0  in the four sides of the element wich represents the parent layout

[java] JavaFX Panel inside Panel auto resizing

Examples related to java

Examples related to css

Examples related to javafx-2

Examples related to fxml

Examples related to pane