Javafx 简明教程

JavaFX - TilePane Layout

TilePane Layout in JavaFX

在 JavaFX 中， TilePane 是一个布局组件，它以统一的尺寸单元水平或垂直排列其子节点。我们可以控制行或列的数量、单元之间的间隙、窗格的对齐方式以及每个单元的首选大小。 javafx.scene.layout 包中的 TilePane 类表示 TilePane。要创建 TilePane，我们可以使用以下任何构造函数 -

In JavaFX, the TilePane is a layout component that arranges its child nodes in uniformly sized tiles, either horizontally or vertically. We can control the number of rows or columns, the gap between tiles, the alignment of the pane and the preferred size of each tile. The class named TilePane of the package javafx.scene.layout represents the TilePane. To create a TilePane, we can use any of the below constructors −

  1. TilePane() − It constructs a new horizontal TilePane layout.

  2. TilePane(double hGap, double vGap) − It creates a new horizontal TilePane layout with the specified hGap and vGap.

  3. TilePane(double hGap, double vGap, Node childNodes) − Constructs a horizontal TilePane layout with the specified hGap, vGap and nodes.

  4. TilePane(Orientation orientation) − It creates a new TilePane layout with the specified orientation. It can be either HORIZONTAL or VERTICAL.

此类提供 11 个属性，如下所示 -

This class provides eleven properties, which are as follows −

S.No

properties & Description

1

alignment*This property represents the alignment of the pane and its value can be set by using the *setAlignment() method.

2

*hgap*This property is of the type double and it represents the horizontal gap between each tile in a row.

3

*vgap*This property is of the type double and it represents the vertical gap between each tile in a row.

4

*orientation*This property represents the orientation of tiles in a row.

5

*prefColumns*This property is of double type and it represents the preferred number of columns for a horizontal tile pane.

6

*prefRows*This property is of double type and it represents the preferred number of rows for a vertical tile pane.

7

*prefTileHeight*This property is of double type and it represents the preferred height of each tile.

8

*prefTileWidth*This property is of double type and it represents the preferred width of each tile.

9

*tileHeight*This property is of double type and it represents the actual height of each tile.

10

*tileWidth*This property is of double type and it represents the actual width of each tile.

11

*tileAlignment*This property is of double type and it represents the default alignment of each child within its tile.

Example

以下程序是平铺窗格布局的示例。在其中，我们正在创建一个包含 7 个按钮的平铺窗格。默认情况下，其方向为水平。使用名称 TilePaneExample.java. 将此代码保存在文件中

The following program is an example of the tile pane layout. In this, we are creating a tile pane which holds 7 buttons. By default, its orientation will be horizontal. Save this code in a file with the name TilePaneExample.java.

import javafx.application.Application;
import javafx.geometry.Orientation;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.TilePane;
import javafx.stage.Stage;

public class TilePaneExample extends Application {
   @Override
   public void start(Stage stage) {
      //Creating an array of Buttons
      Button[] buttons = new Button[] {
         new Button("SunDay"),
         new Button("MonDay"),
         new Button("TuesDay"),
         new Button("WednesDay"),
         new Button("ThursDay"),
         new Button("FriDay"),
         new Button("SaturDay")
      };
      //Creating a Tile Pane
      TilePane tilePane = new TilePane();

      //Setting the alignment for the Tile Pane
      tilePane.setTileAlignment(Pos.CENTER_LEFT);

      //Setting the preferred columns for the Tile Pane
      tilePane.setPrefRows(4);

      //Adding the array of buttons to the pane
      tilePane.getChildren().addAll(buttons);

      //Creating a scene object
      Scene scene = new Scene(tilePane, 400, 300);

      //Setting title to the Stage
      stage.setTitle("Tile Pane Example");

      //Adding scene to the stage
      stage.setScene(scene);

      //Displaying the contents of the stage
      stage.show();
   }
   public static void main(String args[]){
      launch(args);
   }
}

使用以下命令，从命令提示符编译并执行已保存的 java 文件。

Compile and execute the saved java file from the command prompt using the following commands.

javac --module-path %PATH_TO_FX% --add-modules javafx.controls TilePaneExample.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls TilePaneExample

执行后，上述程序会生成如下所示的 JavaFX 窗口。

On executing, the above program generates a JavaFX window as shown below.

tilepane output

Setting the Orientation of TilePane to Vertical

要使用 JavaFX 设置 TilePane 的方向，我们要么使用名为 setOrientation() 的内置方法，要么使用其接受方向作为参数值的带参构造函数。以下 JavaFX 代码演示了如何将 TilePane 的方向设置为垂直。使用名称 JavafxTilepane 将此 JavaFX 代码保存在文件中。

To set the orientation of TilePane in JavaFX, we use either a built-in method named setOrientation() or by using its parameterized constructor which accepts orientation as a parameter value. The below JavaFX code illustrates how to set the orientation of the TilePane to vertical. Save this JavaFX code in a file with the name JavafxTilepane.

Example

import javafx.application.Application;
import javafx.geometry.Orientation;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.TilePane;
import javafx.stage.Stage;

public class JavafxTilepane extends Application {
   @Override
   public void start(Stage stage) {
      // Creating a TilePane with vertical orientation
      TilePane tileP = new TilePane(Orientation.VERTICAL);
      // Setting the preferred number of rows to three
      tileP.setPrefRows(3);

      // Setting the hGap and vGap between tiles
      tileP.setHgap(10);
      tileP.setVgap(10);
      // Setting the alignment of the pane and the tiles
      tileP.setAlignment(Pos.CENTER);
      tileP.setTileAlignment(Pos.CENTER);
      // To add 10 buttons to the pane
      for (int i = 1; i <= 10; i++) {
         Button button = new Button("Button " + i);
         tileP.getChildren().add(button);
      }
      // Create a scene and stage
      Scene scene = new Scene(tileP, 400, 300);
      stage.setTitle("TilePane in JavaFX");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String[] args) {
      launch(args);
   }
}

要从命令提示符编译并执行已保存的 Java 文件，请使用以下命令−

To compile and execute the saved Java file from the command prompt, use the following commands −

javac --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxTilepane.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxTilepane

当我们执行上述代码时，它将生成以下输出 −

When we execute the above code, it will generate the following output −

tilepane output2