Sử dụng GridPane trong JavaFX

GridPane trong JavaFX là một thành phần layout bố trí các thành phần con của nó theo dạng lưới, kích thước của ô trong lưới phụ thuộc vào các thành phần được hiển thị trong GridPane và được tuân thủ theo một số quy tắc nhất định.

GridPane trong JavaFX sắp xếp các thành phần con theo nguyên tắc là tất cả các ô trong cùng một hàng sẽ có cùng chiều cao và tất cả các ô trong cùng một cột sẽ có cùng chiều rộng. Như vậy với các hàng khác nhau có thể có chiều cao khác nhau hoặc các cột khác nhau có thể có chiều rộng khác nhau.

Các thành phần bố trí GridPane trong JavaFX được đại diện bởi lớp javafx.scene.layout.GridPane

1. Khởi tạo GridPane trong JavaFx:

– Để khởi tạo một GridPane bằng cách khai báo như sau:

– Ví dụ sau đây sẽ thêm vào GridPane các nút (Button) như sau:

– Tham số đầu tiên của phương thức add() là thành phần con (nút) để thêm vào GridPane.

– Tham số thứ hai và thứ ba của phương thức add() thể hiện chỉ số lần lượt là cột và hàng, chỉ số cột và hàng bắt đầu bằng 0.

– Tham số thứ tư và thứ năm thể hiện số hàng và số cột mà thành phần (nút) được chứa.

2. Thêm GridPane vào Scene Graph:

– Muốn GridPane trong JavaFx được hiển thị trên giao diện nó phải được thêm vào trong thành phần Scene Graph.

– Nói đơn giản là bạn chỉ cần thêm GridPane vào một đối tượng Scene.

– Kết quả sau khi chạy đoạn mã GridPane trong JavaFx trên có thể như sau:

Sử dụng GridPane trong JavaFX

– Bạn để ý ở ví dụ trên GridPane trong JavaFx thì nếu như các thành trong cửa sổ trở quá nhỏ để hiển thị được tất cả thì nó sẽ không tự động canh chỉnh lại.

3. Thiết lập khoảng cách giữa các nút (nodes):

– Như ở ví dụ trên bạn thấy rằng GridPane sắp xếp các nút nhấn sát cạnh nhau, vậy nếu như bạn muốn chèn một khoảng trống giữa các thành phần thì sẽ cần thêm phương thức setHGap() hoặc setVGap() như sau:

– Đoạn mã chương trình sẽ như sau:

– Kết quả sau khi chạy đoạn mã GridPane trong JavaFx trên có thể như sau:

Sử dụng GridPane trong JavaFX

Download source code bài viết.Sử dụng GridPane trong JavaFX

Xem thêm bài viết về sử dụng Layout trong JavaFx
Sử dụng FlowPane trong JavaFX
Sử dụng VBOX trong JavaFX
Sử dụng HBOX trong JavaFX

Lời kết: Như vậy trong bài viết này mình vừa hướng dẫn các bạn cách sử dụng GridPane trong JavaFx. Ngoài ra, các bạn có thể xem thêm một số thành phần layout (bố cục) khác trong JavaFx như HBox, VBox, FlowPane, TilePane…

(Tác giả: Tùng Dương)

Bình luận

Loading...