Hướng dẫn và ví dụ 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

Nhóm phát triển của chúng tôi vừa ra mắt website langlearning.net học tiếng Anh, Nga, Đức, Pháp, Việt, Trung, Hàn, Nhật, ... miễn phí cho tất cả mọi người.
Là một website được viết trên công nghệ web Flutter vì vậy hỗ trợ rất tốt cho người học, kể cả những người học khó tính nhất.
Hiện tại website đang tiếp tục được cập nhập nội dung cho phong phú và đầy đủ hơn. Mong các bạn nghé thăm và ủng hộ website mới của chúng tôi.

Hãy theo dõi chúng tôi trên Fanpage để nhận được thông báo mỗi khi có bài viết mới.

Facebook

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