在GridPane中的webView頂部放置按鈕

Question

我想爲我的webView創建一個刷新按鈕，該按鈕將位於視圖頂部（即使它隱藏視圖的一部分），當我將按鈕放置在Grid Pane上時將webView向下或向側推（取決於我放置按鈕的位置）

如何將我的「刷新」按鈕放在webView的頂部，而不是將它放在一邊？

import java.util.List; 
import javafx.application.Application; 
import javafx.event.ActionEvent; 
import javafx.event.EventHandler; 
import javafx.geometry.HPos; 
import javafx.geometry.Insets; 
import javafx.geometry.VPos; 
import javafx.scene.Node; 
import javafx.scene.Scene; 
import javafx.scene.control.Button; 
import javafx.scene.layout.ColumnConstraints; 
import javafx.scene.layout.GridPane; 
import javafx.scene.layout.Pane; 
import javafx.scene.layout.Priority; 
import javafx.scene.layout.VBox; 
import javafx.scene.web.WebEngine; 
import javafx.scene.web.WebView; 
import javafx.stage.Stage; 

public class webviewbrowser extends Application { 

@Override public void start(Stage primaryStage) throws Exception { 
    Pane root = new WebViewPane(); 
    primaryStage.setScene(new Scene(root, 1024, 768)); 
    primaryStage.setFullScreen(true); 
    primaryStage.show(); 
} 
public static void main(String[] args) { 
    launch(args); 
} 

/** 
* Create a resizable WebView pane 
*/ 
public class WebViewPane extends Pane { 

    public WebViewPane() { 
     VBox.setVgrow(this, Priority.ALWAYS); 
     setMaxWidth(Double.MAX_VALUE); 
     setMaxHeight(Double.MAX_VALUE); 

     WebView view = new WebView(); 
     view.setMinSize(500, 400); 
     view.setPrefSize(500, 400); 
     final WebEngine eng = view.getEngine(); 
     eng.load("http://google.com"); 
     //final TextField locationField = new TextField("http://www.google.com"); 
     //locationField.setMaxHeight(Double.MAX_VALUE); 
     Button goButton = new Button("Refresh"); 
     goButton.setDefaultButton(true); 

     EventHandler<ActionEvent> goAction = new EventHandler<ActionEvent>() { 
      @Override public void handle(ActionEvent event) { 
       eng.reload(); 
      } 
     }; 
     goButton.setOnAction(goAction); 

     GridPane grid = new GridPane(); 
     grid.setVgap(0); 
     grid.setHgap(0); 

     GridPane.setConstraints(goButton,2,0,2,1, HPos.RIGHT, VPos.BOTTOM, Priority.ALWAYS, Priority.ALWAYS); 
     GridPane.setConstraints(view, 0, 0, 2, 1, HPos.CENTER, VPos.CENTER, Priority.SOMETIMES, Priority.SOMETIMES); 
     grid.getColumnConstraints().addAll(
       new ColumnConstraints(100, 100, Double.MAX_VALUE, Priority.ALWAYS, HPos.CENTER, true), 
       new ColumnConstraints(40, 40, 40, Priority.NEVER, HPos.CENTER, true) 
     ); 
     grid.getChildren().addAll(goButton, view); 
     getChildren().add(grid); 
    } 

    @Override protected void layoutChildren() { 
     List<Node> managed = getManagedChildren(); 
     double width = getWidth(); 
     double height = getHeight(); 
     double top = getInsets().getTop(); 
     double right = getInsets().getRight(); 
     double left = getInsets().getLeft(); 
     double bottom = getInsets().getBottom(); 
     for (int i = 0; i < managed.size(); i++) { 
      Node child = managed.get(i); 
      layoutInArea(child, left, top, 
          width - left - right, height - top - bottom, 
          0, Insets.EMPTY, true, true, HPos.CENTER, VPos.CENTER); 
     } 
    } 
} 

}

Answer 1

如果你想堆在另一個上面一個組成部分，不使用佈局GridPane，而不是使用父，允許被放置在彼此的頂部佈局的構成要素。例如，標準Pane，StackPane,Group或Region。在這些堆疊樣式佈局中，組件按照子組件在父級子列表中的位置順序呈現。

在示例代碼中你已經擴展面板，所以去掉所有網格碼的，只是做的事：而不是

getChildren().addAll(view, goButton); 

：

grid.getChildren().addAll(goButton, view); 

修改的佈局屬性的goButton將其放置在不管理其子節點的佈局位置的父級中，例如你可以撥打goButton.relocate(xPos, yPos)。

你在layoutChildren方法中有一些自定義的東西，你可能會搞亂默認的Pane佈局處理邏輯。重寫layoutChildren更像是一個高級佈局主題，我不會爲初學者提供建議。

這裏是一個更新的樣本，你可以看到它使用了一些在該答覆中提到的概念。

import javafx.application.Application; 
import javafx.event.*; 
import javafx.scene.Scene; 
import javafx.scene.control.Button; 
import javafx.scene.layout.Pane; 
import javafx.scene.web.*; 
import javafx.stage.Stage; 

public class WebViewBrowser extends Application { 
    @Override public void start(Stage stage) throws Exception { 
     stage.setScene(new Scene(new WebViewPane("http://google.com"))); 
     stage.setFullScreen(true); 
     stage.show(); 
    } 

    public static void main(String[] args) { launch(args); } 
} 

class WebViewPane extends Pane { 
    final WebView view  = new WebView(); 
    final Button goButton = createGoButton(view.getEngine()); 

    public WebViewPane(String initURL) { 
     view.getEngine().load(initURL); 

     getChildren().addAll(
      view, 
      goButton 
     ); 

     initLayout(); 
    } 

    private Button createGoButton(final WebEngine eng) { 
     Button go = new Button("Refresh"); 
     go.setDefaultButton(true); 
     go.setOnAction(new EventHandler<ActionEvent>() { 
      @Override public void handle(ActionEvent event) { 
       eng.reload(); 
      } 
     }); 

     return go; 
    } 

    private void initLayout() { 
     setMinSize(500, 400); 
     setPrefSize(1024, 768); 

     view.prefWidthProperty().bind(widthProperty()); 
     view.prefHeightProperty().bind(heightProperty()); 

     goButton.setLayoutX(10); 
     goButton.layoutYProperty().bind(
      heightProperty().subtract(20).subtract(goButton.heightProperty()) 
     ); 
    } 
}