JavaFX Stack Pane

Stack Pane

Stack Pane的類別為javafx.scene.layout.StackPane，類似於Java Swing的Overlay Layout。

Overlay Layout如同其名稱Overlay (覆蓋) 一般，以堆疊的方式配置物件，並且以對齊點 (Alignment Point) 設定物件的對齊位置，此外，藉由物件最小、最佳及最大尺寸的設定，作為調整容器大小時，物件調整的依據。

Stack Pane同樣是以堆疊的方式配置物件，並且藉由setAlignment()方法設定對齊方式。當完成Stack Pane設定之後，則以Pane類別的getChildren().add()或getChildren().addAll()方法將物件加至Stack Pane之中。

除了StackPane類別之外，JavaFX並提供StackPaneBuilder類別配置物件。

請參考以下範例，示範如何以Stack Pane配置按鈕物件，由於Stack Pane是以堆疊的方式配置物件，當以add()或addAll()方法將物件加至Stack Pane時，是採先加入者在最下層，接著依序往上堆疊的方式配置。以範例為例，以addAll()方法依序將ListView、ImageView與Label加至Stack Pane之中，因此檢視清單在最下層、圖像其次、標籤在最上層，產生重疊的效果。

StackPane stackpane = new StackPane(); stackpane.setPadding(new Insets(10, 10, 10, 10)); Label label = new Label("Stack Pane"); ListView<String> list = new ListView<>(); ObservableList<String> months =   FXCollections.observableArrayList(     "January", "February", "March", "April",      "May", "June", "July", "August",      "September", "October", "November", "December"); list.setItems(months); ImageView image =   new ImageView(new Image(      StackPaneDemo.class.getResourceAsStream(     "images/Icon00.png"))); // 將所有物件加至Stack Pane之中 stackpane.getChildren().addAll(list, image, label);

【執行結果】

除了StackPane類別之外，JavaFX並提供StackPaneBuilder類別配置物件，以StackPaneBuilder配置物件的程式架構如下，首先以create()方法建立StackPaneBuilder的實體 (Instance)，最後再以build()方法以StackPaneBuilder物件建立Stack Pane的實體，其間以alignment()方法設定物件的水平與垂直對齊方式，再以children()方法將物件置於Stack Pane區域中：

StackPane stackpane = StackPaneBuilder.create()   .alignment(...)   .children(...)   .build();

請參考以下範例。

Label label = new Label("Stack Pane"); ListView<String> list = new ListView<>(); ObservableList<String> months =   FXCollections.observableArrayList(     "January", "February", "March", "April",      "May", "June", "July", "August",      "September", "October", "November", "December"); list.setItems(months); ImageView image =   new ImageView(new Image(      StackPaneDemo.class.getResourceAsStream(     "images/Icon00.png"))); // 建立SceneBuilder的實體（Instance） Scene scene = SceneBuilder.create()   .width(250)   .height(250)   .root(     // 建立StackPaneBuilder的實體（Instance）     StackPaneBuilder.create()       .alignment(Pos.CENTER)       .padding(new Insets(10, 10, 10, 10))       // 將物件置於Stack Pane中       .children(list, image, label)       // 以StackPaneBuilder物件建立StackPane的實體（Instance）       .build()   )   .build();

【參考資料】

[1] 黃嘉輝，深入研究JavaFX 2。
[2] 黃嘉輝，深入研究Java Swing。
[3] Java Official Web Site：http://www.oracle.com/technetwork/java/index.html
[4] JavaFX：http://www.oracle.com/technetwork/java/javafx
[5] JavaFX 2.2 API Specification.
[6] Java Platform, Standard Edition 7 API Specification.

© Chia-Hui Huang