Question

我正在一个小型项目中创建一个Beatbox应用程序，在其中我使用JavaFX作为设计工具的UI和场景构建器。当我在其中放置组件时，我可以看到它不是全屏显示，但是当我将其与Eclipse IDE链接时。我将舞台设置为全屏模式，但是我将组件放置在最左端，但我想使其自身对齐。

primaryStage.setMaximized(true);

primaryStage.setMaximized(true);

它必须自动对齐，但不像它最左边。

enter image description here

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

<?import com.jfoenix.controls.JFXButton?>
<?import com.jfoenix.controls.JFXProgressBar?>
<?import javafx.scene.Cursor?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.image.Image?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>

 <VBox prefHeight="400.0" prefWidth="640.0" 
  xmlns="http://javafx.com/javafx/11.0.1" 
  xmlns:fx="http://javafx.com/fxml/1" fx:controller="box.firstcontroller">
 <children>
 <AnchorPane maxHeight="-1.0" maxWidth="-1.0" prefHeight="-1.0" 
 prefWidth="-1.0" style="-fx-background-color: #78909C;" 
 VBox.vgrow="ALWAYS">
  <children>
        <JFXProgressBar layoutX="203.0" layoutY="333.0" />
        <ImageView fitHeight="186.0" fitWidth="164.0" layoutX="53.0" 
  layoutY="94.0" pickOnBounds="true" preserveRatio="true">
           <cursor>
              <Cursor fx:constant="S_RESIZE" />
           </cursor>
           <image>
              <Image url="@../login.png" />
           </image>
        </ImageView>
        <ImageView fitHeight="164.0" fitWidth="151.0" layoutX="410.0" 
  layoutY="101.0" pickOnBounds="true" preserveRatio="true">
           <image>
              <Image url="@../signup.png" />
           </image>
        </ImageView>
        <Label layoutX="251.0" layoutY="36.0" text="BeatBox">
           <font>
              <Font name="Tempus Sans ITC" size="41.0" />
           </font>
        </Label>
        <JFXButton fx:id="signup" buttonType="RAISED" layoutX="68.0" 
     layoutY="314.0" onAction="#signupform" prefHeight="44.0" 
     prefWidth="115.0" ripplerFill="#752f2f" style="-fx-background-color: 
     #ae2121;" text="Sign Up" textFill="#fcfcfcf2">
           <font>
              <Font name="Webdings" size="20.0" />
           </font>
        </JFXButton>
        <JFXButton fx:id="signin" layoutX="428.0" layoutY="312.0" 
      onAction="#signinform" prefHeight="17.0" prefWidth="115.0" style="- 
      fx-background-color: #ae2121;" text="Sign In" textFill="WHITE">
           <font>
              <Font size="20.0" />
           </font>
        </JFXButton>
       </children>
      </AnchorPane>
      </children>
     </VBox>

〜

Answer 1

您实际上遇到了几个问题。首先，您的根VBox有一个AnchorPane作为其子元素，而子元素又保存了各个节点。

这导致您被迫手动设置这些节点的X / Y坐标。这是设计很差的。

相反，您应该使用JavaFX提供的各种布局窗格来为您布置节点。

这是一个非常基本的示例，类似于您的布局，并且具有完全可扩展性：

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

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ProgressBar?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>
<VBox alignment="TOP_CENTER" spacing="10.0" xmlns="http://javafx.com/javafx/9.0.1" xmlns:fx="http://javafx.com/fxml/1">
    <padding>
        <Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/>
    </padding>
    <children>
        <Label text="BeatBox">
            <font>
                <Font name="Tempus Sans ITC" size="48.0"/>
            </font>
        </Label>
        <HBox alignment="CENTER" spacing="10.0" VBox.vgrow="ALWAYS">
            <children>
                <Button mnemonicParsing="false" text="Sign Up"/>
                <ProgressBar prefWidth="200.0" progress="0.0"/>
                <Button mnemonicParsing="false" text="Sign In"/>
            </children>
        </HBox>
    </children>
</VBox>

请注意，我正在标题下方使用HBox来水平排列按钮。无需手动设置坐标或尺寸；让JavaFX为您完成工作！

结果：

场景构建器层次结构：

在Eclipse中为场景构建器中设计的UI设置setfullscreen（boolean）

1 个答案: