JavaFX - บานหน้าต่างเค้าโครง (คอนเทนเนอร์)

หลังจากสร้างโหนดที่จำเป็นทั้งหมดในฉากแล้วโดยทั่วไปเราจะจัดเรียงตามลำดับ

การจัดเรียงส่วนประกอบภายในคอนเทนเนอร์นี้เรียกว่า Layout of the container นอกจากนี้เรายังสามารถพูดได้ว่าเราทำตามเค้าโครงเนื่องจากมีการวางส่วนประกอบทั้งหมดไว้ที่ตำแหน่งใดตำแหน่งหนึ่งภายในคอนเทนเนอร์

JavaFX มีเค้าโครงที่กำหนดไว้ล่วงหน้าหลายแบบเช่น HBox, VBox, Border Pane, Stack Pane, Text Flow, Anchor Pane, Title Pane, Grid Pane, Flow Panelฯลฯ

เลย์เอาต์ที่กล่าวถึงข้างต้นแต่ละอันแสดงโดยคลาสและคลาสเหล่านี้ทั้งหมดเป็นของแพ็กเกจ javafx.layout. ชั้นเรียนชื่อPane เป็นคลาสพื้นฐานของเลย์เอาต์ทั้งหมดใน JavaFX

การสร้างเลย์เอาต์

ในการสร้างเค้าโครงคุณต้อง -

• สร้างโหนด
• สร้างอินสแตนซ์คลาสตามลำดับของเลย์เอาต์ที่ต้องการ
• ตั้งค่าคุณสมบัติของเค้าโครง
• เพิ่มโหนดที่สร้างขึ้นทั้งหมดลงในเค้าโครง

การสร้างโหนด

ก่อนอื่นให้สร้างโหนดที่จำเป็นของแอ็พพลิเคชัน JavaFX โดยสร้างอินสแตนซ์คลาสตามลำดับ

ตัวอย่างเช่นหากคุณต้องการมีช่องข้อความและปุ่มสองปุ่มคือเล่นและหยุดในรูปแบบ HBox คุณจะต้องสร้างโหนดเหล่านั้นในขั้นต้นดังที่แสดงในบล็อกโค้ดต่อไปนี้ -

//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");

การสร้างอินสแตนซ์คลาสที่เกี่ยวข้อง

หลังจากสร้างโหนด (และดำเนินการทั้งหมดบนโหนดเสร็จสิ้น) ให้สร้างอินสแตนซ์คลาสของเลย์เอาต์ที่ต้องการ

ตัวอย่างเช่นหากคุณต้องการสร้างเค้าโครง Hbox คุณต้องสร้างอินสแตนซ์คลาสนี้ดังนี้

HBox hbox = new HBox();

การตั้งค่าคุณสมบัติของเค้าโครง

หลังจากสร้างอินสแตนซ์คลาสแล้วคุณต้องตั้งค่าคุณสมบัติของโครงร่างโดยใช้วิธีการตั้งค่าตามลำดับ

ตัวอย่างเช่น - หากคุณต้องการกำหนดช่องว่างระหว่างโหนดที่สร้างขึ้นในเค้าโครง HBox คุณจะต้องกำหนดค่าให้กับคุณสมบัติที่ชื่อระยะห่าง สามารถทำได้โดยใช้วิธี settersetSpacing() ดังแสดงด้านล่าง -

hbox.setSpacing(10);

การเพิ่ม Shape Object ในกลุ่ม

สุดท้ายคุณต้องเพิ่มวัตถุของรูปร่างลงในกลุ่มโดยส่งเป็นพารามิเตอร์ของตัวสร้างดังที่แสดงด้านล่าง

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

บานหน้าต่างเค้าโครง

ต่อไปนี้เป็นบานหน้าต่าง Layout (คลาส) ต่างๆที่จัดเตรียมโดย JavaFX คลาสเหล่านี้มีอยู่ในแพ็คเกจjavafx.scene.layout.

ส. เลขที่	รูปร่างและคำอธิบาย
1	HBox เค้าโครง HBox จะจัดเรียงโหนดทั้งหมดในแอปพลิเคชันของเราในแถวแนวนอนเดียว ชั้นเรียนชื่อ HBox ของแพ็คเกจ javafx.scene.layout แสดงเค้าโครงกล่องข้อความแนวนอน
2	VBox เค้าโครง VBox จัดเรียงโหนดทั้งหมดในแอปพลิเคชันของเราในคอลัมน์แนวตั้งเดียว ชั้นเรียนชื่อ VBox ของแพ็คเกจ javafx.scene.layout แสดงเค้าโครงกล่องข้อความแนวตั้ง
3	BorderPane เค้าโครง Border Pane จะจัดเรียงโหนดในแอปพลิเคชันของเราในตำแหน่งด้านบนซ้ายขวาล่างและตรงกลาง ชั้นเรียนชื่อ BorderPane ของแพ็คเกจ javafx.scene.layout แสดงเค้าโครงบานหน้าต่างชายแดน
4	StackPane เค้าโครงบานหน้าต่างสแต็กจะจัดเรียงโหนดในแอปพลิเคชันของเราไว้ด้านบนของอีกโหนดหนึ่งเช่นเดียวกับในสแต็ก โหนดที่เพิ่มก่อนจะถูกวางไว้ที่ด้านล่างของสแต็กและโหนดถัดไปจะถูกวางไว้ด้านบน ชั้นเรียนชื่อ StackPane ของแพ็คเกจ javafx.scene.layout แสดงเค้าโครงบานหน้าต่างสแตก
5	TextFlow เค้าโครง Text Flow จัดเรียงโหนดข้อความหลายโหนดในโฟลว์เดียว ชั้นเรียนชื่อ TextFlow ของแพ็คเกจ javafx.scene.layout แสดงเค้าโครงโฟลว์ข้อความ
6	AnchorPane เค้าโครงของบานหน้าต่าง Anchor ยึดโหนดในแอปพลิเคชันของเราที่ระยะห่างเฉพาะจากบานหน้าต่าง ชั้นเรียนชื่อ AnchorPane ของแพ็คเกจ javafx.scene.layout แทนเค้าโครง Anchor Pane
7	TilePane เค้าโครงแผ่นกระเบื้องจะเพิ่มโหนดทั้งหมดของแอปพลิเคชันของเราในรูปแบบของกระเบื้องที่มีขนาดสม่ำเสมอ ชั้นเรียนชื่อ TilePane ของแพ็คเกจ javafx.scene.layout แสดงถึงเค้าโครง TilePane
8	GridPane เค้าโครง Grid Pane จัดเรียงโหนดในแอปพลิเคชันของเราเป็นตารางของแถวและคอลัมน์ เค้าโครงนี้มีประโยชน์ในขณะสร้างแบบฟอร์มโดยใช้ JavaFX ชั้นเรียนชื่อ GridPane ของแพ็คเกจ javafx.scene.layout แสดงถึงเค้าโครง GridPane
9	FlowPane เค้าโครงบานหน้าต่างโฟลว์จะรวมโหนดทั้งหมดในโฟลว์ บานหน้าต่างการไหลแนวนอนจะห่อองค์ประกอบของบานหน้าต่างไว้ที่ความสูงในขณะที่บานหน้าต่างการไหลแนวตั้งจะห่อองค์ประกอบที่ความกว้าง ชั้นเรียนชื่อ FlowPane ของแพ็คเกจ javafx.scene.layout แสดงเค้าโครง Flow Pane