如何将ControlsFX(对话框)与FXML文件一起使用?

时间:2014-04-01 12:16:52

标签: user-interface javafx-2 fxml

我有以下想法:

  • 我想使用ControlsFX:不错的用户界面,对对话框的良好支持。
  • 我想使用FXML作为UI的源代码:Scene Builder可以很好地工作,快速创建和更改。

现在我在使用ControlsFX和FXML文件创建的UI时遇到了问题。这是源代码:

public class ConfigUI {
private Dialog dlg;

@FXML
TextField urlRepository;

protected Action showConfigDialog() throws IOException {
    dlg = new Dialog(null, "Configuration Dialog for Check SVN");

    Node content = null;
    content = FXMLLoader.load(getClass().getResource("check-dialog.fxml"));

    dlg.setResizable(false);
    dlg.setIconifiable(false);
    dlg.setContent(content);
    dlg.getActions().addAll(Dialog.Actions.OK, Dialog.Actions.CANCEL);
    return dlg.show();
}

相应的FXML文件check-dialog.fxml如下:

<AnchorPane id="AnchorPane"  xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2" fx:controller="ConfigUI">
  <children>
    <Label layoutX="29.0" layoutY="26.0" text="URL of Repository" />
    <Label layoutX="29.0" layoutY="76.0" text="Revision Interval" />
    <TextField fx:id="urlRepository" layoutY="23.0" prefWidth="200.0" AnchorPane.leftAnchor="170.0" AnchorPane.rightAnchor="10.0" />
    <Slider fx:id="revIntervalLow" layoutY="77.0" prefWidth="196.0" AnchorPane.leftAnchor="170.0" AnchorPane.rightAnchor="234.0" />
    ...
  </children>
</AnchorPane>

当我现在通过以下代码启动对话框时,TextField urlRepository的@FXML不起作用:

    public void configureActionTrigger(ActionEvent actionEvent) {
      ConfigUI ui = new ConfigUI();
      Action result = ui.showConfigDialog();
      ...
    }

在调试器中,我看到属性urlRepository从未绑定。我在这里缺少什么?是否有必要拥有一个应用程序类和一个控制器类,并且应用程序类构建UI,然后绑定控制器?

互联网上是否有一个示例可以解释一下如何在一个非常重要的示例中解释ControlsFX和FXML文件如何一起使用?

2 个答案:

答案 0 :(得分:3)

该行

content = FXMLLoader.load(getClass().getResource("check-dialog.fxml"));

将创建ConfigUI类的新实例,因此您当前实例的urlRepository仍然未实例化。而是尝试:

FXMLLoader loader = new FXMLLoader();
loader.setController(this);
content = (Parent) loader.load(getClass().getResourceAsStream("check-dialog.fxml"));

答案 1 :(得分:2)

我找到了Uluk Biy小费的工作解决方案。这对我有用:

  1. 将方法showConfigDialog()移至来电者。
  2. 获取对话框和UI实例的引用(以便稍后从中获取配置的值)并将该引用添加到该调用中。
  3. 以下是对上述内容的更改:

    Controller
      public void configureActionTrigger(ActionEvent actionEvent) {
        Dialog dlg = new Dialog(null, "Configuration Dialog for Check SVN");
        Action result = this.showConfigDialog(dlg);
        ...
      }
    
      protected Action showConfigDialog(Dialog dlg) throws IOException {
        Node content = content = FXMLLoader.load(getClass().getResource("check-dialog.fxml"));
        dlg.setResizable(false);
        dlg.setIconifiable(false);
        dlg.setContent(content);
        dlg.getActions().addAll(Dialog.Actions.OK, Dialog.Actions.CANCEL);
    
        return dlg.show();
    }
    
    ConfigUI
      @FXML
      TextField urlRepository;
    

    check-dialog.fxm无需更改。

    现在TextField已正确绑定,当我在文本字段中输入内容时,该字段的值会按预期更改。

    所以解决方案是将构建对话框的UI的责任转移到另一个类,让控制器只处理输入。