JavaFX - 网格布局(GridPane)



JavaFX 中的 GridPane 布局

GridPane 是一种布局容器,其中所有节点都以形成行和列网格的方式排列。此布局在创建表单、图表、媒体库等方面非常方便。

在 JavaFX 中,名为 GridPane 的类(位于 javafx.scene.layout 包中)表示 GridPane 布局。使用其默认构造函数实例化此类将在我们的 JavaFX 应用程序中创建一个网格面板布局。此类提供以下属性:

  • alignment - 此属性表示面板的对齐方式,您可以使用 setAlignment() 方法设置此属性的值。

  • hgap - 此属性为 double 类型,表示列之间的水平间距。

  • vgap - 此属性为 double 类型,表示行之间的垂直间距。

  • gridLinesVisible - 此属性为布尔类型。设置为 true 时,面板的网格线将可见。

下表说明了 JavaFX 网格面板中的单元格位置。每个单元格的第一个值表示行,第二个值表示列。

(0, 0) (1, 0) (2, 0)
(0, 1) (1, 1) (2, 1)
(0, 2) (1, 2) (2, 2)

示例

以下程序是网格面板布局的示例。在此示例中,我们使用网格面板创建一个表单。将此代码保存到名为 GridPaneExample.java 的文件中。

import javafx.application.Application; 
import javafx.geometry.Insets; 
import javafx.geometry.Pos; 
import javafx.scene.Scene; 
import javafx.scene.control.Button; 
import javafx.scene.layout.GridPane; 
import javafx.scene.text.Text; 
import javafx.scene.control.TextField; 
import javafx.stage.Stage; 

public class GridPaneExample extends Application { 
   @Override 
   public void start(Stage stage) {      
      //creating label email 
      Text text1 = new Text("Email");       
      
      //creating label password 
      Text text2 = new Text("Password"); 
	  
      //Creating Text Filed for email        
      TextField textField1 = new TextField();       
      
      //Creating Text Filed for password        
      TextField textField2 = new TextField();  
       
      //Creating Buttons 
      Button button1 = new Button("Submit"); 
      Button button2 = new Button("Clear");  
      
      //Creating a Grid Pane 
      GridPane gridPane = new GridPane();    
      
      //Setting size for the pane  
      gridPane.setMinSize(400, 200); 
       
      //Setting the padding  
      gridPane.setPadding(new Insets(10, 10, 10, 10)); 
      
      //Setting the vertical and horizontal gaps between the columns 
      gridPane.setVgap(5); 
      gridPane.setHgap(5);       
      
      //Setting the Grid alignment 
      gridPane.setAlignment(Pos.CENTER); 
       
      //Arranging all the nodes in the grid 
      gridPane.add(text1, 0, 0); 
      gridPane.add(textField1, 1, 0); 
      gridPane.add(text2, 0, 1);       
      gridPane.add(textField2, 1, 1); 
      gridPane.add(button1, 0, 2); 
      gridPane.add(button2, 1, 2);  
      
      //Creating a scene object 
      Scene scene = new Scene(gridPane, 400, 300);  
      
      //Setting title to the Stage 
      stage.setTitle("Grid Pane Example in JavaFX"); 
         
      //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 文件,请使用以下命令:

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

输出

执行上述程序将生成一个 JavaFX 窗口,显示使用 GridPane 布局构建的表单。

Grid Pane
广告