java—如何在javafx中清晰地对齐对象

x6yk4ghg 于 2021-07-06 发布在 Java

关注(0)|答案(2)|浏览(372)

我必须做一些基本的javafx工作，但我有一个问题，我不能处理。首先，我的目标布局是：

我所做的是创建两个网格窗格，并尝试将它们彼此对齐。一开始，好像没事。但当我写下剩下的部分时，它开始变得非常糟糕，我开始无法调整任何东西。制作底部按钮菜单非常简单。但不管我做了什么，我都无法对齐文本字段和标签。这是我的密码`

addButton = new Button("Add");
firstButton = new Button("First");
nextButton = new Button("Next");
previousButton = new Button("Previous");
lastButton = new Button("Last");
updateByIdButton = new Button("Update By Id");
searchByIdButton = new Button("Search By Id");
cleanButton = new Button("Clean textFields");

GridPane root = new GridPane();

HBox bottomMenu = new HBox();

bottomMenu.getChildren().addAll(addButton, firstButton, nextButton, previousButton, lastButton, updateByIdButton, searchByIdButton, cleanButton);
bottomMenu.setSpacing(10);
BorderPane border = new BorderPane();
bottomMenu.setPadding(new Insets(10, 10, 10, 20));
border.setBottom(bottomMenu);

GridPane labels = new GridPane();
border.setCenter(root);

labels.setVgap(8);
labels.setHgap(5);
labels.setPadding(new Insets(10, 10, 10, 80));
Label idLabel = new Label("ID : ");
GridPane.setConstraints(idLabel, 0, 4);
Label nameLabel = new Label("Name : ");
GridPane.setConstraints(nameLabel, 0, 6);
Label streetLabel = new Label("Street : ");
GridPane.setConstraints(streetLabel, 0, 10);
Label cityLabel = new Label("City : ");
GridPane.setConstraints(cityLabel, 0, 13);
Label searchUpdateLabel = new Label("Search/Update ID : ");
GridPane.setConstraints(searchUpdateLabel, 19, 3);
Label genderLabel = new Label("Gender : ");
GridPane.setConstraints(genderLabel, 20, 6);
Label zipLabel = new Label("Zip : ");
GridPane.setConstraints(zipLabel, 25, 6);
labels.getChildren().addAll(idLabel, nameLabel, streetLabel, cityLabel, searchUpdateLabel, genderLabel, zipLabel);
labels.getColumnConstraints().add(new ColumnConstraints(50));
labels.getColumnConstraints().add(new ColumnConstraints(400));
root.getChildren().add(labels);

GridPane fields = new GridPane();
fields.setPadding(new Insets(10, 10, 10, 80));
fields.setVgap(10);
TextField idField = new TextField();
idField.setDisable(true);
idField.setMaxWidth(50);
GridPane.setConstraints(idField, 1, 3);
TextField nameField = new TextField();
GridPane.setConstraints(nameField, 1, 5);
TextField streetField = new TextField();
GridPane.setConstraints(streetField, 1, 6);
TextField cityField = new TextField();
GridPane.setConstraints(cityField, 1, 7);
TextField zipField = new TextField();
GridPane.setConstraints(zipField, 16, 6);
TextField genderField = new TextField();
GridPane.setConstraints(genderField, 21, 6);
TextField searchUpdateField = new TextField();
GridPane.setConstraints(searchUpdateField, 21, 3);
fields.getChildren().addAll(idField, nameField, streetField, cityField, zipField, genderField, searchUpdateField);
fields.getColumnConstraints().add(new ColumnConstraints(50));
fields.getColumnConstraints().add(new ColumnConstraints(400));
root.getChildren().add(fields);

而且，当我尝试使用 GridPane.setConstraints() 或添加新列。

Java javafx css

来源：https://stackoverflow.com/questions/65645839/how-to-align-objects-in-javafx-clearly

2条答案

按热度按时间

zlwx9yxi1#

看起来你把gridpane当成了一维对象，而实际上它是二维的。目标中的所有元素不是像网格一样排列的，但是只需一个网格窗格就可以获得非常接近目标的内容，并且必须使用跨越多个列的一些元素来设置它：

public class GridPaneSample extends GridPane {

public GridPaneSample() {
    add(new Label("ID"), 0, 0);
    Label searchIdLabel = new Label("Search/Update ID");
    TextField searchIdField = new TextField();
    TextField nameField = new TextField("Merve");
    TextField streetField = new TextField("Adnan Menderes");
    TextField cityField = new TextField("Ayden");
    add(searchIdLabel, 2, 0);
    add(new Label("Name"), 0, 1);
    add(new Label("Street"), 0, 2);
    add(new Label("City"), 0, 3);
    add(new Label("Gender"), 3, 3);
    add(new Label("Zip"), 5, 3);
    add(new TextField("1"), 1, 0);
    add(searchIdField, 3, 0);
    add(nameField, 1, 1);
    add(streetField, 1, 2);
    add(cityField, 1, 3);
    add(new TextField("F"), 4, 3);
    add(new TextField("1234"), 6, 3);
    setColumnSpan(searchIdLabel, 2);
    setColumnSpan(searchIdField, 4);
    setColumnSpan(nameField, 6);
    setColumnSpan(streetField, 6);
    setColumnSpan(cityField, 2);
    setVgap(4);
    setHgap(4);
    ColumnConstraints col50 = new ColumnConstraints(50);
    getColumnConstraints()
            .addAll(col50, new ColumnConstraints(70), new ColumnConstraints(100), col50, new ColumnConstraints(30),
                    new ColumnConstraints(20), col50);
    setPadding(new Insets(10, 0, 0, 60));
}
}

它变得有点难看，并且不太适合gridpane的用例。使用vbox，然后将每一行放入hbox可能更容易。您可以将第一个textfield“column”对齐，方法是将每行的第一个标签放在自己的hbox中，并将该hbox的minwidth设置为每行相同的值。这样地：

public class BoxesSample extends VBox {

public BoxesSample() {
    HBox row1 = new HBox(6, fixedSpaceLabel("ID"), sizedTextField("1", 60), new Label("Search/Update ID"),
                         sizedTextField("", 154));
    HBox row2 = new HBox(6, fixedSpaceLabel("Name"), sizedTextField("Merve", 320));
    HBox row3 = new HBox(6, fixedSpaceLabel("Street"), sizedTextField("Adnan Menderes", 320));
    HBox row4 = new HBox(6, fixedSpaceLabel("City"), sizedTextField("Aydin", 160), new Label("Gender"),
                         sizedTextField("F", 20), new Label("Zip"), sizedTextField("1234", 60));
    getChildren().addAll(row1, row2, row3, row4);
    setPadding(new Insets(10, 0, 0, 60));
    setSpacing(4);
}

private HBox fixedSpaceLabel(String labelText) {
    HBox results = new HBox(new Label(labelText));
    results.setMinWidth(50);
    results.setAlignment(Pos.CENTER_LEFT);
    return results;
}

private TextField sizedTextField(String initialValue, double width) {
    TextField results = new TextField(initialValue);
    results.setMinWidth(width);
    results.setMaxWidth(width);
    return results;
}
}

赞(0）回复(0）举报 2021-07-06

4smxwvx52#

这是你的名字 FXML . 也许你可以把它翻译成纯代码。它被分解成一个 VBox 作为根。这个 VBox 有一个 GridPane 和一个 HBox 为了孩子。
fxml公司

<?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.TextField?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>

<VBox alignment="CENTER" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="168.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <GridPane hgap="4.0" maxHeight="-Infinity" maxWidth="-Infinity" prefWidth="400.0">
        <columnConstraints>
            <ColumnConstraints hgrow="SOMETIMES" maxWidth="-Infinity" minWidth="-Infinity" />
            <ColumnConstraints hgrow="SOMETIMES" />
            <ColumnConstraints hgrow="SOMETIMES" />
          <ColumnConstraints hgrow="SOMETIMES" />
            <ColumnConstraints hgrow="SOMETIMES" maxWidth="-Infinity" minWidth="-Infinity" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="-Infinity" />
          <ColumnConstraints hgrow="SOMETIMES" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="-Infinity" />
            <ColumnConstraints hgrow="SOMETIMES" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
        </columnConstraints>
        <rowConstraints>
            <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
          <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
          <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
          <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
        </rowConstraints>
         <children>
            <Label text="ID" />
            <TextField GridPane.columnIndex="1" />
            <TextField GridPane.columnIndex="5" GridPane.columnSpan="2147483647" />
            <Label text="Search/Updated ID" GridPane.columnIndex="4" />
            <Label text="Name" GridPane.rowIndex="1" />
            <Label text="Street" GridPane.rowIndex="2" />
            <Label text="City" GridPane.rowIndex="3" />
            <TextField maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.columnSpan="2147483647" GridPane.rowIndex="1" />
            <TextField GridPane.columnIndex="1" GridPane.columnSpan="2147483647" GridPane.rowIndex="2" />
            <TextField GridPane.columnIndex="1" GridPane.columnSpan="4" GridPane.rowIndex="3" />
            <Label text="Gender" GridPane.columnIndex="5" GridPane.rowIndex="3" />
            <Label text="Zip" GridPane.columnIndex="7" GridPane.rowIndex="3" />
            <TextField GridPane.columnIndex="6" GridPane.rowIndex="3" />
            <TextField GridPane.columnIndex="8" GridPane.columnSpan="2147483647" GridPane.rowIndex="3" />
         </children>
         <VBox.margin>
            <Insets />
         </VBox.margin>
         <padding>
            <Insets bottom="20.0" />
         </padding>
      </GridPane>
      <HBox maxWidth="-Infinity" spacing="3.0">
         <children>
            <Button mnemonicParsing="false" text="Add" />
            <Button mnemonicParsing="false" text="First" />
            <Button mnemonicParsing="false" text="Next" />
            <Button mnemonicParsing="false" text="Previous" />
            <Button mnemonicParsing="false" text="Last" />
            <Button mnemonicParsing="false" text="UpdateByID" />
            <Button mnemonicParsing="false" text="SerachByID" />
            <Button mnemonicParsing="false" text="Cean textFields" />
         </children>
      </HBox>
   </children>
</VBox>

赞(0）回复(0）举报 2021-07-06

我来回答

java—如何在javafx中清晰地对齐对象

2条答案

相关问题

热门标签

最新问答