Панель JavaFX внутри панели Автоматическое изменение размера панели

У меня есть приложение JavaFX, в котором есть только один файл FXML. В этом файле у меня есть одна AnchorPane, в которой есть StackPane. Вот скриншот:

Когда я запускаю это приложение, я хочу автоматически изменить размер StackPane с помощью AnchorPane. Таким образом, StackPane автоматически получит текущую доступную ширину и высоту. В момент изменения размера приложения AnchorPane автоматически изменяется, но StackPane остается фиксированным.

Как я могу изменить размер StackPane автоматически и полностью растянуть его на своей родительской панели?

Мой код

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

<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane fx:id="anchorPane" xmlns:fx="http://javafx.com/fxml" fx:controller="app.MainController">
    <StackPane fx:id="stackPane" ></StackPane>
</AnchorPane>

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%;
}

Ответы

Ответ 1

После нескольких часов поиска и тестирования, наконец, получил его сразу после публикации вопроса!

Вы можете использовать команды fxml " AnchorPane.topAnchor, AnchorPane.bottomAnchor, AnchorPane.leftAnchor, AnchorPane.rightAnchor " со значением "0.0", чтобы подогнать/растянуть/выровнять дочерние элементы внутри AnchorPane. Таким образом, эти команды говорят дочернему элементу следовать за его родителем при изменении размера.

Мой обновленный код Main.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane fx:id="anchorPane" xmlns:fx="http://javafx.com/fxml" fx:controller="app.MainController">
    <!--<StackPane fx:id="stackPane" ></StackPane>--> <!-- replace with the following -->
    <StackPane fx:id="stackPane" AnchorPane.topAnchor="0.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" ></StackPane>
</AnchorPane>

Вот результат:

Для документации API: http://docs.oracle.com/javafx/2/api/javafx/scene/layout/AnchorPane.html

Ответ 2

Я разрабатывал графический интерфейс в SceneBuilder, пытаясь сделать основной контейнер адаптированным к любому размеру окна. Он должен быть всегда на 100%.

Здесь вы можете установить эти значения в SceneBuilder:

Переключение пунктирных/красных линий фактически просто добавит/удалит атрибуты, которые Корки опубликовал в своем решении (AnchorPane.topAnchor и т.д.).

Ответ 3

Также см. здесь

@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());
    }
}

Сценарий заключается в загрузке дочернего fxml в родительский AnchorPane. Чтобы заставить ребенка растягиваться в соответствии со своим родителем, используйте команду AnChorPane.setxxxAnchor.

Ответ 4

Это довольно просто, потому что вы используете FXMLBuilder.

Просто выполните следующие простые шаги:

Откройте файл FXML в FXMLBuilder.
Выберите стек стека.
Откройте вкладку "Макет" [вкладка левой стороны FXMLBuilder].
Задайте значение сторон, с помощью которого вы хотите вычислить размер панели во время изменения размера сцены, например TOP, LEFT, RIGHT, BOTTOM.

Ответ 5

Если вы используете Scene Builder, вы увидите справа панель аккордеона, которая обычно имеет три варианта ( "Свойства", "Макет" и "Код" ). Во втором ( "Макет" ) вы увидите опцию "[parent layout] Constraints" (в вашем случае "AnchorPane Constrainsts" ).

Вы должны поместить "0" в четыре стороны элемента, который представляет родительский макет.

Ответ 6

Не нужно уступать.

просто выберите панель, щелкните правой кнопкой мыши, затем выберите "Подгонка к родительскому" .

Он автоматически изменит размер панели на размер панели привязки.