Eclipse中用于场景构建器中设计的UI的setfullscreen（boolean）

Question

I'm working on a mini project to create a beatbox application where I used JavaFX as UI and scene builder for the designing tool. While I placed components there I can see that it's not full screen but when I linked that with Eclipse IDE. I set the stage as set fullscreen mode but I having components placed far left but I wanted to align itself.

primaryStage.setMaximized(true);

primaryStage.setMaximized(true);

It has to be automatically aligned but not like it is far left.

<?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

You actually have several issues going on. First of all, your root VBox has an AnchorPane as it's child element, which in turn holds the individual nodes.

This leads you to being forced into setting the X/Y coordinates for those nodes manually. This is pretty poorly designed.

Instead, you should use the various layout panes that JavaFX provides to handle laying out the nodes for you.

Here is a very basic example that sort of resembles your layout, and it's fully scalable:

<?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>

---

Note that I'm using a HBox below the title to layout the buttons horizontally. No need to manually set coordinates or sizes; let JavaFX do the work for you!

The Result:

Scene Builder Heirarchy: