JavaFX WebView grows to fill the whole area

Question

I am trying to make a javafx webview that expands to the surrounding JPanel. According to this topic: http://www.coderanch.com/t/634791/JavaFX/java/Resizing-HTMLEditor-JavaFX , there is an error in WebView where you need to call GridPane.setHgrow and GridPane.setVgrow in WebView, I twisted my code with these calls, but WebView is still 600x800px.

Note that the scene has a blue background, so you can see that javafx stuff fills the entire JPanel. But WebView does not populate the javafx / Scene group.

 import java.awt.BorderLayout; import javax.swing.JButton; import javax.swing.JFrame; import javax.swing.JPanel; import javax.swing.SwingUtilities; import javafx.application.Platform; import javafx.embed.swing.JFXPanel; import javafx.scene.Group; import javafx.scene.Scene; import javafx.scene.layout.GridPane; import javafx.scene.layout.Priority; import javafx.scene.paint.Color; import javafx.scene.web.WebEngine; import javafx.scene.web.WebView; public class Main { private void initAndShowGUI() { // This method is invoked on the EDT thread JFrame frame = new JFrame("Swing and JavaFX"); frame.setSize(1000, 1000); frame.setVisible(true); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JPanel panel = new JPanel(new BorderLayout(0, 0)); frame.getContentPane().add(panel, BorderLayout.CENTER); JButton button = new JButton("button"); panel.add(button, BorderLayout.CENTER); final JFXPanel fxPanel = new JFXPanel(); panel.add(fxPanel, BorderLayout.CENTER); Platform.runLater(new Runnable() { @Override public void run() { initFX(fxPanel); } }); } private WebView webView; private void initFX(JFXPanel fxPanel) { // This method is invoked on the JavaFX thread Scene scene = createScene(); fxPanel.setScene(scene); GridPane.setHgrow(webView, Priority.ALWAYS); GridPane.setVgrow(webView, Priority.ALWAYS); } private Scene createScene() { Group root = new Group(); Scene scene = new Scene(root, Color.ALICEBLUE); webView = new WebView(); GridPane.setHgrow(webView, Priority.ALWAYS); GridPane.setVgrow(webView, Priority.ALWAYS); WebEngine webEngine = webView.getEngine(); webEngine.load("http://www.google.com"); root.getChildren().add(webView); GridPane.setHgrow(webView, Priority.ALWAYS); GridPane.setVgrow(webView, Priority.ALWAYS); return scene; } public static void main(String[] args) { SwingUtilities.invokeLater(new Runnable() { @Override public void run() { new Main().initAndShowGUI(); } }); } } 

Answer 1

One approach is to add a WebView to StackPane , which "will try to resize each child to fill its contents area." I attached the JFXPanel to a custom size of 640 x 480 ; resize the frame to see how StackPane updates the contents of the WebView based on the standard Pos.CENTER .

 import java.awt.BorderLayout; import javax.swing.JFrame; import javax.swing.SwingUtilities; import javafx.application.Platform; import javafx.embed.swing.JFXPanel; import javafx.scene.Scene; import javafx.scene.layout.StackPane; import javafx.scene.web.WebEngine; import javafx.scene.web.WebView; /** @see https://stackoverflow.com/a/31576647/230513 */ public class WebViewTest { private void initAndShowGUI() { // This method is invoked on the EDT thread JFrame frame = new JFrame("Swing and JavaFX"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); final JFXPanel fxPanel = new JFXPanel(){ @Override public Dimension getPreferredSize() { return new Dimension(640, 480); } }; frame.add(fxPanel, BorderLayout.CENTER); frame.pack(); frame.setLocationRelativeTo(null); frame.setVisible(true); Platform.runLater(() -> { initFX(fxPanel); }); } private void initFX(JFXPanel fxPanel) { // This method is invoked on the JavaFX thread Scene scene = createScene(); fxPanel.setScene(scene); } private Scene createScene() { StackPane root = new StackPane(); Scene scene = new Scene(root); WebView webView = new WebView(); WebEngine webEngine = webView.getEngine(); webEngine.load("http://www.example.com"); root.getChildren().add(webView); return scene; } public static void main(String[] args) { SwingUtilities.invokeLater(new WebViewTest()::initAndShowGUI); } } 

Answer 2

Actually, I think I got a solution based on http://docs.oracle.com/javafx/2/webview/WebViewSample.java.htm :

 import java.awt.BorderLayout; import javax.swing.JFrame; import javax.swing.JPanel; import javafx.application.Platform; import javafx.embed.swing.JFXPanel; import javafx.geometry.HPos; import javafx.geometry.VPos; import javafx.scene.Scene; import javafx.scene.layout.Region; import javafx.scene.paint.Color; import javafx.scene.web.WebEngine; import javafx.scene.web.WebView; import javafx.stage.Stage; public class WebViewSample { public static void main(String[] args) { JFrame frame = new JFrame("Swing and JavaFX"); frame.setSize(1000, 1000); frame.setVisible(true); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JPanel panel = new JPanel(new BorderLayout(0, 0)); frame.getContentPane().add(panel, BorderLayout.CENTER); final JFXPanel jfxPanel = new JFXPanel(); panel.add(jfxPanel); Platform.runLater(new Runnable() { @Override public void run() { initFx(jfxPanel); } }); } private static void initFx(JFXPanel fxPanel) { Stage stage = new Stage(); stage.setTitle("Web View"); Scene scene = new Scene(new Browser(), 1000, 1000, Color.web("#666970")); stage.setScene(scene); fxPanel.setScene(scene); } } class Browser extends Region { final WebView browser = new WebView(); final WebEngine webEngine = browser.getEngine(); public Browser() { // load the home page webEngine.load("http://www.google.com"); //add components getChildren().add(browser); } @Override protected void layoutChildren() { double w = getWidth(); double h = getHeight(); layoutInArea(browser,0,0,w,h,0,HPos.CENTER,VPos.CENTER); } } 

I think the trick is to subclass Region, so you can deploy the WebView where you want it manually.