JavaFX布局-GridPane
- 常用实行
- alignment
- hgap
- vgap
- padding
- gridLinesVisible
- 实现方式
- Java实现
- fxml实现
- 使用行和列来组织其子节点
- 将节点放置在二维网格中的任何单元格,同时也可以设置跨越行、跨越列
常用实行
alignment
对齐方式,设置内容居中,顶部居中等
gridPane.setAlignment(Pos.TOP_CENTER);
public enum Pos {/*** Represents positioning on the top vertically and on the left horizontally.*/TOP_LEFT(TOP, LEFT),/*** Represents positioning on the top vertically and on the center horizontally.*/TOP_CENTER(TOP, HPos.CENTER),/*** Represents positioning on the top vertically and on the right horizontally.*/TOP_RIGHT(TOP, RIGHT),/*** Represents positioning on the center vertically and on the left horizontally.*/CENTER_LEFT(VPos.CENTER, LEFT),/*** Represents positioning on the center both vertically and horizontally.*/CENTER(VPos.CENTER, HPos.CENTER),/*** Represents positioning on the center vertically and on the right horizontally.*/CENTER_RIGHT(VPos.CENTER, RIGHT),/*** Represents positioning on the bottom vertically and on the left horizontally.*/BOTTOM_LEFT(BOTTOM, LEFT),/*** Represents positioning on the bottom vertically and on the center horizontally.*/BOTTOM_CENTER(BOTTOM, HPos.CENTER),/*** Represents positioning on the bottom vertically and on the right horizontally.*/BOTTOM_RIGHT(BOTTOM, RIGHT),/*** Represents positioning on the baseline vertically and on the left horizontally.*/BASELINE_LEFT(BASELINE, LEFT),/*** Represents positioning on the baseline vertically and on the center horizontally.*/BASELINE_CENTER(BASELINE, HPos.CENTER),/*** Represents positioning on the baseline vertically and on the right horizontally.*/BASELINE_RIGHT(BASELINE, RIGHT);
}
hgap
水平间距
gridPane.setHgap(10);
vgap
垂直间距
gridPane.setVgap(10);
padding
内边距,可以单独设置上、下、左、右的内边距
gridPane.setPadding(new Insets(10, 10, 10, 10));
gridLinesVisible
显示网格线
gridPane.setGridLinesVisible(true);
实现方式
Java实现
public static GridPane demo1() {// 创建gridPaneGridPane gridPane = new GridPane();// 对齐方式gridPane.setAlignment(Pos.CENTER);// 水平间距gridPane.setHgap(3);// 垂直间距gridPane.setVgap(3);// 内边距gridPane.setPadding(new Insets(10, 10, 10, 10));// 显示网格线gridPane.setGridLinesVisible(true);// 圆形Circle circle = new Circle(100, Color.RED);gridPane.add(circle, 0, 0);// 矩形Rectangle rectangle = new Rectangle(120, 100, Color.BLUE);gridPane.add(rectangle, 1, 0);// 按钮1Button button1 = new Button("Button 1");gridPane.add(button1, 0, 1);// 按钮1Button button2 = new Button("Button 1");gridPane.add(button2, 1, 1);// 多边形Polygon polygon = new Polygon(10, 20, 30, 40, 50, 20);polygon.setFill(Color.RED);polygon.setStroke(Color.BLACK);polygon.setStrokeWidth(2);gridPane.add(polygon, 0, 2, 2, 1);return gridPane;}
fxml实现
<GridPane alignment="CENTER" gridLinesVisible="true" hgap="3" prefHeight="400" prefWidth="600" vgap="3"xmlns="http://javafx.com/javafx/17.0.2-ea" xmlns:fx="http://javafx.com/fxml/1"><padding><Insets bottom="5" left="5" right="5" top="5"/></padding><columnConstraints><ColumnConstraints percentWidth="50"/><ColumnConstraints percentWidth="50"/></columnConstraints><rowConstraints><RowConstraints minHeight="100" prefHeight="30"/><RowConstraints minHeight="100" prefHeight="30"/><RowConstraints minHeight="100" prefHeight="30"/></rowConstraints><children><Circle fill="red" radius="50.0" stroke="BLACK" strokeType="INSIDE" GridPane.columnIndex="0"GridPane.rowIndex="0"/><Rectangle fill="blue" height="100" width="120" GridPane.columnIndex="1" GridPane.rowIndex="0"/><Button text="Button 1" GridPane.columnIndex="0" GridPane.rowIndex="1"/><Button text="Button 2" GridPane.columnIndex="1" GridPane.rowIndex="1"/><Polygon fill="red" stroke="BLACK" strokeType="INSIDE" GridPane.columnIndex="0" GridPane.rowIndex="2"GridPane.columnSpan="2"><points><Double fx:value="10"/><Double fx:value="20"/><Double fx:value="30"/><Double fx:value="40"/><Double fx:value="50"/><Double fx:value="20"/></points></Polygon></children>
</GridPane>