JavaFX 自定义组件未出现

Question

我正在尝试在 JavaFX 中创建自定义组件。这个组件是将在应用程序中使用的对话框的基础，基本上它是一个 BorderPane，顶部有一个自定义标题，底部有一个按钮。这是 SceneBuilder 中组件的图片:

这里是 fxml 声明:

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

<?import java.net.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>
<?scenebuilder-stylesheet ../css/style.css?>

<fx:root type="javafx.scene.layout.BorderPane" xmlns:fx="http://javafx.com/fxml">
  <bottom>
    <HBox alignment="CENTER_RIGHT" prefHeight="62.0" prefWidth="-1.0" BorderPane.alignment="CENTER">
      <children>
        <Button fx:id="botaoConfirmar" alignment="CENTER" contentDisplay="RIGHT"    ellipsisString="" graphicTextGap="4.0" mnemonicParsing="false" onAction="#confirmar" prefHeight="35.0" prefWidth="165.0" style="-fx-background-color: #3a813f;" text="OK (F12)" textAlignment="CENTER" textFill="WHITE" wrapText="false">
          <font>
            <Font name="System Bold" size="12.0" fx:id="x1" />
          </font>
          <stylesheets>
            <URL value="@../css/style.css" />
          </stylesheets>
          <HBox.margin>
            <Insets left="10.0" right="10.0" />
          </HBox.margin>
        </Button>
      </children>
    </HBox>
  </bottom>
  <stylesheets>
    <URL value="@../css/style.css" />
  </stylesheets>
  <top>
    <HBox alignment="TOP_LEFT" disable="true" fillHeight="true" focusTraversable="true" prefHeight="46.0" prefWidth="-1.0" spacing="0.0" style="-fx-background-color: #3a813f;&#10;-fx-background-position: 100;" visible="true" BorderPane.alignment="CENTER">
      <children>
        <Text fx:id="titulo" fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="TITULO" textAlignment="CENTER" wrappingWidth="0.0" x="0.0" HBox.hgrow="ALWAYS">
          <font>
            <Font size="20.0" />
          </font>
          <HBox.margin>
            <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
          </HBox.margin>
        </Text>
      </children>
    </HBox>
  </top>
</fx:root>

如您所见，我的目的是将此组件用作基本对话框并将特定对话框的内容放在中心:

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

<?import com.lutum.ui.controladores.*?>
<?import com.lutum.ui.controladores.DialogoComum?>
<?import java.lang.*?>
<?import java.net.*?>
<?import java.util.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.paint.*?>
<?import javafx.scene.text.*?>
<?scenebuilder-classpath-element ../../../../../target/ui-0.1.0.jar?>

<DialogoComum maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="-1.0" prefWidth="-1.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2">
  <center>
    <VBox prefHeight="-1.0" prefWidth="-1.0">
      <children>
        <HBox maxWidth="400.0" minWidth="-1.0" prefHeight="-1.0" prefWidth="-1.0">
          <children>
            <ImageView id="icone" fitHeight="64.0" fitWidth="64.0" pickOnBounds="true" preserveRatio="true" HBox.hgrow="NEVER">
              <HBox.margin>
                <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
              </HBox.margin>
            </ImageView>
            <Text id="mensagem" strokeType="OUTSIDE" strokeWidth="0.0" text="Text">
              <HBox.margin>
                <Insets right="10.0" top="20.0" />
              </HBox.margin>
            </Text>
          </children>
        </HBox>
        <Accordion id="accordion" minHeight="0.0" minWidth="0.0" prefHeight="-1.0" prefWidth="-1.0" VBox.vgrow="ALWAYS">
          <expandedPane>
            <TitledPane fx:id="x2" text="Detalhes">
              <content>
                <AnchorPane minHeight="-1.0" minWidth="-1.0" prefHeight="-1.0" prefWidth="-1.0">
                  <children>
                    <Text id="detalhes" layoutX="14.0" layoutY="26.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Text" />
                  </children>
                </AnchorPane>
              </content>
            </TitledPane>
          </expandedPane>
          <panes>
            <fx:reference source="x2" />
          </panes>
          <VBox.margin>
            <Insets left="10.0" right="10.0" />
          </VBox.margin>
        </Accordion>
      </children>
    </VBox>
  </center>
</DialogoComum>

如您所见，该组件可以在 SceneBuilder 中正确使用，但是，当我在应用程序中使用它时却没有发生同样的情况，我只能看到一个白屏:

这是 DialogoComum 的代码(用于 dialogoComum.fxml):

public class DialogoComum extends BorderPane implements IControladorDialogo {

    @FXML
    protected Text titulo;
    protected URL modelo;
    protected Stage stage;
    protected List<String> estilos = new ArrayList<String>();

    public DialogoComum() {
        /*needed by SceneBuilder*/
        this.modelo = getClass().getResource("/gui/dialogos/dialogoComum.fxml");
        FXMLLoader fxmlLoader = new FXMLLoader(modelo);
        fxmlLoader.setRoot(this);
        fxmlLoader.setController(this);
        try {
            fxmlLoader.load();
        } catch (IOException exception) {
            throw new RuntimeException(exception);
        }
    }

    public DialogoComum (String nothing){
        //Just to not call the above constructor
    }

    @Override
    public final void init() {
        try {
            stage = new Stage();
            stage.setScene(carregarCena());
            stage.initStyle(StageStyle.UNDECORATED);
            stage.initModality(Modality.APPLICATION_MODAL);
            stage.setWidth(200);
            stage.setHeight(200);
            configurarElementos();
        } catch (IOException e) {
            throw new RuntimeException(e);
        }
    }

    protected final Scene carregarCena() throws IOException {
        SpringFXMLLoader.load(modelo.openStream(), this);
        Scene cena = new Scene(this);
        cena.getStylesheets().addAll(estilos);
        return cena;
    }

    protected void configurarElementos() {}

    @FXML
    public void confirmar(ActionEvent evento) {}

    @Override
    public void abrir() {
        stage.showAndWait();
    }

    @Override
    public void fechar() {
        stage.close();
    }
}

和 ControladorDialogoMensagem(对于 dialogoMensagem.fxml):

public class ControladorDialogoMensagem extends DialogoComum {

    @FXML
    private Text mensagem;
    @FXML
    private Text detalhes;
    @FXML
    private ImageView icone;
    @FXML
    private Accordion accordion;
    private URL iconeSucesso;
    private URL iconeAlerta;
    private URL iconeErro;

    public ControladorDialogoMensagem() {
        super(null);
    }

    .
    .
    .

    @FXML
    public void confirmar(ActionEvent e) {
        fechar();
    }
}

最后是应用代码

public class AppBase extends Application implements ApplicationContextAware {

    protected ControladorDialogoMensagem dialogoMensagem;
    protected ApplicationContext contexto;

    public static void main(String args[]) {
        launch(args);
    }

    @Override
    public void start(Stage stage) throws Exception {
        ApplicationContext contexto = new ClassPathXmlApplicationContext("/spring/appContext.xml");
        dialogoMensagem=contexto.getBean(ControladorDialogoMensagem.class);
        dialogoMensagem.abrir();
    }

    .
    .
    .
}

我能做些什么来解决它？

Answer 1

在 中你不能使用 <stylesheets> 标签。而是像这样在 fx:root 元素上使用属性:

<fx:root stylesheets="@chatlist.css" type="javafx.scene.layout.AnchorPane" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">