JavaFX - Bố cục Panes (Vùng chứa)

Sau khi xây dựng tất cả các nút cần thiết trong một cảnh, chúng tôi thường sắp xếp chúng theo thứ tự.

Sự sắp xếp này của các thành phần bên trong vùng chứa được gọi là Bố cục của vùng chứa. Chúng tôi cũng có thể nói rằng chúng tôi đã tuân theo một bố cục vì nó bao gồm việc đặt tất cả các thành phần ở một vị trí cụ thể trong vùng chứa.

JavaFX cung cấp một số bố cục được xác định trước như HBox, VBox, Border Pane, Stack Pane, Text Flow, Anchor Pane, Title Pane, Grid Pane, Flow Panel, Vân vân.

Mỗi bố cục được đề cập ở trên được đại diện bởi một lớp và tất cả các lớp này đều thuộc về gói javafx.layout. Lớp có tênPane là lớp cơ sở của tất cả các bố cục trong JavaFX.

Tạo một bố cục

Để tạo một bố cục, bạn cần phải -

Tạo nút.
Khởi tạo lớp tương ứng của bố cục bắt buộc.
Đặt các thuộc tính của bố cục.
Thêm tất cả các nút đã tạo vào bố cục.

Tạo nút

Trước hết, tạo các nút cần thiết của ứng dụng JavaFX bằng cách khởi tạo các lớp tương ứng của chúng.

Ví dụ: nếu bạn muốn có một trường văn bản và hai nút cụ thể là phát và dừng trong bố cục HBox - ban đầu bạn sẽ phải tạo các nút đó như được hiển thị trong khối mã sau -

//Creating a text field 
TextField textField = new TextField();       

//Creating the play button 
Button playButton = new Button("Play");       

//Creating the stop button 
Button stopButton = new Button("stop");

Khởi tạo lớp tương ứng

Sau khi tạo các nút (và hoàn thành tất cả các thao tác trên chúng), hãy khởi tạo lớp của bố cục bắt buộc.

Ví dụ: nếu bạn muốn tạo một bố cục Hbox, bạn cần khởi tạo lớp này như sau.

HBox hbox = new HBox();

Đặt thuộc tính của bố cục

Sau khi khởi tạo lớp, bạn cần thiết lập các thuộc tính của bố cục bằng cách sử dụng các phương thức setter tương ứng của chúng.

Ví dụ - Nếu bạn muốn đặt khoảng cách giữa các nút đã tạo trong bố cục HBox, thì bạn cần đặt giá trị cho thuộc tính có tên là khoảng cách. Điều này có thể được thực hiện bằng cách sử dụng phương pháp settersetSpacing() như hình dưới đây -

hbox.setSpacing(10);

Thêm đối tượng hình dạng vào nhóm

Cuối cùng, bạn cần thêm đối tượng của shape vào nhóm bằng cách chuyển nó dưới dạng tham số của hàm tạo như hình dưới đây.

//Creating a Group object  
Group root = new Group(line);

Các ngăn bố cục

Sau đây là các ngăn (lớp) Bố cục khác nhau được cung cấp bởi JavaFX. Các lớp này tồn tại trong góijavafx.scene.layout.

S. không	Hình dạng & Mô tả
1	HBox Bố cục HBox sắp xếp tất cả các nút trong ứng dụng của chúng tôi thành một hàng ngang. Lớp có tên HBox của gói javafx.scene.layout đại diện cho bố cục hộp văn bản ngang.
2	VBox Bố cục VBox sắp xếp tất cả các nút trong ứng dụng của chúng ta trong một cột dọc duy nhất. Lớp có tên VBox của gói javafx.scene.layout đại diện cho văn bản Bố cục hộp dọc.
3	BorderPane Bố cục Border Pane sắp xếp các nút trong ứng dụng của chúng tôi ở các vị trí trên cùng, trái, phải, dưới cùng và trung tâm. Lớp có tên BorderPane của gói javafx.scene.layout đại diện cho bố cục ngăn viền.
4	StackPane Bố cục ngăn ngăn xếp sắp xếp các nút trong ứng dụng của chúng tôi trên đầu trang khác giống như trong ngăn xếp. Nút được thêm vào đầu tiên được đặt ở dưới cùng của ngăn xếp và nút tiếp theo được đặt ở trên cùng của nó. Lớp có tên StackPane của gói javafx.scene.layout đại diện cho bố cục ngăn xếp.
5	TextFlow Bố cục Luồng văn bản sắp xếp nhiều nút văn bản trong một luồng duy nhất. Lớp có tên TextFlow của gói javafx.scene.layout đại diện cho bố cục dòng văn bản.
6	AnchorPane Bố cục ngăn Anchor neo các nút trong ứng dụng của chúng tôi ở một khoảng cách cụ thể từ ngăn. Lớp có tên AnchorPane của gói javafx.scene.layout đại diện cho bố cục Anchor Pane.
7	TilePane Bố cục Ngăn xếp thêm tất cả các nút của ứng dụng của chúng tôi dưới dạng các ô có kích thước đồng nhất. Lớp có tên TilePane của gói javafx.scene.layout đại diện cho bố cục TilePane.
số 8	GridPane Bố cục Ngăn lưới sắp xếp các nút trong ứng dụng của chúng tôi dưới dạng lưới các hàng và cột. Bố cục này rất tiện lợi khi tạo biểu mẫu bằng JavaFX. Lớp có tên GridPane của gói javafx.scene.layout đại diện cho bố cục GridPane.
9	FlowPane Bố cục ngăn luồng bao bọc tất cả các nút trong một luồng. Ngăn dòng ngang bao bọc các phần tử của ngăn theo chiều cao của nó, trong khi ngăn dòng dọc bao bọc các phần tử theo chiều rộng của nó. Lớp có tên FlowPane của gói javafx.scene.layout đại diện cho bố cục Flow Pane.