【问题标题】:JavaFX Panel inside Panel auto resizing面板内的 JavaFX 面板自动调整大小
【发布时间】:2013-02-19 20:30:49
【问题描述】:

我有一个只有一个 FXML 文件的 JavaFX 应用程序。在这个文件中,我有一个 AnchorPane,里面有一个 StackPane。这是截图:

当我启动这个应用程序时,我想使用 AnchorPane 自动调整 StackPane 的大小。因此; 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%;
}

【问题讨论】:

    标签: java css javafx-2 fxml pane


    【解决方案1】:

    经过几个小时的搜索和测试,终于在发布问题后得到了它!

    您可以使用值为“0.0”的“AnchorPane.topAnchor、AnchorPane.bottomAnchor、AnchorPane.leftAnchor、AnchorPane.rightAnchor”fxml 命令来适应/拉伸/align 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

    【讨论】:

    • 你能接受这个答案吗?会让我们知道这个问题有一个解决方案。很好的发现,正在寻找这个。
    • @blo0p3r 我会,但现在系统说“你可以在 2 天内接受你自己的答案”;)希望有更多其他建议。
    • 嗨。作为一个按钮被添加。例如。 按钮 fx:id="button" layoutX="172.0" layoutY="195.0" onAction="#ingresarLogin" prefHeight="35.0" prefWidth="87.0" text="Ingresar" /> 它是正确的??谢谢sss
    • 这也适用于其他控件,而不仅仅是窗格。我刚刚在 TabbedPane、AnchorPane 和 TreeView 上使用了它,它们都可以拉伸以适应。很有帮助。
    • 如果您希望锚点为 0,为什么还要在 AnchorPane 中保留 StackPane?
    【解决方案2】:

    我在 SceneBuilder 中设计了一个 GUI,试图让主容器适应任何窗口大小。它应始终为 100% 宽。

    这是您可以在 SceneBuilder 中设置这些值的地方:

    切换虚线/红线实际上只会添加/删除 Korki 在其解决方案中发布的属性(AnchorPane.topAnchor 等)。

    【讨论】:

    • 这会生成什么 FXML 代码?我想看看。
    • 那么您如何启动 SceneBuilder 并亲自查看...它在不到 20 秒内完成...
    【解决方案3】:

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

    场景是将子 fxml 加载到父 AnchorPane 中。 为了让孩子根据其父母进行伸展,请使用 AnChorPane.setxxxAnchor 命令。

    【讨论】:

      【解决方案4】:

      这很简单,因为您使用的是 FXMLBuilder

      只需按照以下简单步骤:

      1. 在 FXMLBuilder 中打开 FXML 文件。
      2. 选择堆栈窗格。
      3. 打开布局选项卡 [FXMLBuilder 的左侧选项卡]。
      4. 设置在舞台调整大小(如 TOP、LEFT、RIGHT、BOTTOM)期间计算窗格大小的边值。

      【讨论】:

        【解决方案5】:

        如果您使用的是 Scene Builder,您将在右侧看到一个手风琴面板,该面板通常具有三个选项(“属性”、“布局”和“代码”)。在第二个(“布局”)中,您将看到一个名为“[父布局] 约束”的选项(在您的情况下为“AnchorPane 约束”)。

        你应该把“0”放在代表父布局的元素的四个边上。

        【讨论】:

          【解决方案6】:

          没有必要放弃。

          只需选择窗格右键单击,然后选择适合父级

          它会自动调整窗格大小以锚定窗格大小。

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 1970-01-01
            • 2013-03-11
            • 1970-01-01
            • 1970-01-01
            • 2013-10-06
            • 2012-08-29
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多