Hướng dẫn sử dụng JavaFX GridPane Layout

Xem thêm các chuyên mục:

Các hướng dẫn lập trình JavaFX

GridPane Layout
Ví dụ với GridPane
Thiết kế GridPane với Scene Builder

1- GridPane Layout

GridPane là một bộ chứa, nó chia bề mặt của nó thành một lướt, bao gồm các hàng và các cột. Một thành phần con (child node), có thể nằm trên một ô lưới hoặc nằm trên một ô hợp nhất từ các ô gần nhau.

2- Ví dụ với GridPane

GridPaneDemo.java

package org.o7planning.javafx.gridpane;

import javafx.application.Application;
import javafx.geometry.HPos;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.PasswordField;
import javafx.scene.control.TextField;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;

public class GridPaneDemo extends Application {

   @Override
   public void start(Stage primaryStage) throws Exception {
       GridPane root = new GridPane();

       root.setPadding(new Insets(20));
       root.setHgap(25);
       root.setVgap(15);

       Label labelTitle = new Label("Enter your user name and password!");

 
       // Đặt vào ô lưới (0, 0) , bắc qua 2 cột, 1 dòng.
       root.add(labelTitle, 0, 0, 2, 1);

       Label labelUserName = new Label("User Name");
       TextField fieldUserName = new TextField();

       Label labelPassword = new Label("Password");

       PasswordField fieldPassword = new PasswordField();

       Button loginButton = new Button("Login");

       GridPane.setHalignment(labelUserName, HPos.RIGHT);

 
       // Đặt vào ô lưới (0,1)
       root.add(labelUserName, 0, 1);

       
       GridPane.setHalignment(labelPassword, HPos.RIGHT);
       root.add(labelPassword, 0, 2);
 
       // Căn lề trái cho User Name
       GridPane.setHalignment(fieldUserName, HPos.LEFT);
       root.add(fieldUserName, 1, 1);

 
       // Căn lề trái cho trường Password
       GridPane.setHalignment(fieldPassword, HPos.LEFT);
       root.add(fieldPassword, 1, 2);

 
       // Căn lề phải cho button Login.
       GridPane.setHalignment(loginButton, HPos.RIGHT);
       root.add(loginButton, 1, 3);

       Scene scene = new Scene(root, 300, 300);
       primaryStage.setTitle("GridPanel Layout Demo (o7planning.org)");
       primaryStage.setScene(scene);
       primaryStage.show();
   }

   public static void main(String[] args) {
       launch(args);
   }

}

Chạy ví dụ:

3- Thiết kế GridPane với Scene Builder

TODO:

Xem thêm các chuyên mục:

Các hướng dẫn lập trình JavaFX