Java 如何在面板内填充浏览器框架？

我正在开发一个应用程序，它需要使用BrowserFrame在一个面板中显示一个网页，但我不能让它填满包含该框架的面板中的整个空间

主视图代码如下所示：

public class MyUI extends UI implements ViewDisplay {

private static final long serialVersionUID = -3506630583522354337L;
private Panel springViewDisplay;
@Override
protected void init(VaadinRequest request) {

     final VerticalLayout root = new VerticalLayout();
     root.setSizeFull();
     root.setMargin(true);
     root.setSpacing(true);
     setContent(root);
     final CssLayout navigationBar = new CssLayout();
     navigationBar.addStyleName(ValoTheme.LAYOUT_COMPONENT_GROUP);
     navigationBar.addComponent(createNavigationButton("Subir fichero",
                FileUpload.VIEW_NAME));

     navigationBar.addComponent(createNavigationButton("Visor grafico", 
             GraphViewer.VIEW_NAME));

     root.addComponent(navigationBar);

      springViewDisplay = new Panel();
      springViewDisplay.setSizeFull();
      root.addComponent(springViewDisplay);
      root.setExpandRatio(springViewDisplay, 1.0f);

}

private Button createNavigationButton(String caption,
        final String viewName) {
    Button button = new Button(caption);
    button.addStyleName(ValoTheme.BUTTON_SMALL);

     button.addClickListener(
            event -> getUI().getNavigator().navigateTo(viewName));
    return button;
}


@Override
public void showView(View view) {
    springViewDisplay.setContent((Component) view);

}

}

显示html文件的视图是，它是一个不同的java类：

@SpringView(name = GraphViewer.VIEW_NAME)
public class GraphViewer extends VerticalLayout implements View {

private static final long serialVersionUID = 3328857273907967208L;
public static final String VIEW_NAME = "viewer";
private final Logger log = LoggerFactory.getLogger(this.getClass());

@PostConstruct
protected void init(){
    ExternalResource page = new ExternalResource("graph.html");

    BrowserFrame frame = new BrowserFrame("", page);
    frame.setSizeFull();

    addComponent(frame);
}

@Override
public void enter(ViewChangeEvent event) {
}
}

任何帮助都将不胜感激

更新： 我尝试将GraphViewercomponent大小设置为100%，但结果如下所示：

（红色：视图大小，绿色：帧大小）前一幅图像的代码如下：

protected void init(){
    ExternalResource page = new  ExternalResource("graph.html");
    BrowserFrame frame = new BrowserFrame("", page);
    setSizeFull();
    addComponent(frame);
}

protected void init(){
    ExternalResource page = new  ExternalResource("graph.html");
    BrowserFrame frame = new BrowserFrame("", page);
    setSizeFull();
    addComponent(frame);
}

然后，如果我更改frame.setSizeFill（）的setSizeFill（），则该帧显示如下：

protected void init(){
    ExternalResource page = new  ExternalResource("graph.html");
    BrowserFrame frame = new BrowserFrame("", page);
    setSizeFull();
    addComponent(frame);
}

protected void init(){
    ExternalResource page = new  ExternalResource("graph.html");
    BrowserFrame frame = new BrowserFrame("", page);
    setSizeFull();
    addComponent(frame);
}

---

更新：发现问题在于iframe元素（BrowserFrame）没有正确计算高度

你可以尝试用CSS来解决这个问题

将样式名称添加到框架中：

BrowserFrame frame = new BrowserFrame("", page);
frame.addStyleName("embedded-frame");
setSizeFull();

然后添加以下CSS规则：

.embedded-frame iframe {
    position: absolute;        
}

---

更新：问题在于iframe元素（BrowserFrame）没有正确计算高度

你可以尝试用CSS来解决这个问题

将样式名称添加到框架中：

BrowserFrame frame = new BrowserFrame("", page);
frame.addStyleName("embedded-frame");
setSizeFull();

然后添加以下CSS规则：

.embedded-frame iframe {
    position: absolute;        
}

---

谢谢你的回答。我尝试将

GraphViewer

组件大小设置为100%，但结果如下所示：

（红色：视图大小，绿色：帧大小） 上一幅图像的代码如下所示：

protected void init(){
    ExternalResource page = new  ExternalResource("graph.html");
    BrowserFrame frame = new BrowserFrame("", page);
    setSizeFull();
    addComponent(frame);
}

protected void init(){
    ExternalResource page = new  ExternalResource("graph.html");
    BrowserFrame frame = new BrowserFrame("", page);
    setSizeFull();
    addComponent(frame);
}

然后，如果我更改

frame.setSizivel（）

的

setSizivel（）

，则该框架如下所示：

---

谢谢你的回答。我尝试将

GraphViewer

组件大小设置为100%，但结果如下所示：

（红色：视图大小，绿色：帧大小） 上一幅图像的代码如下所示：

protected void init(){
    ExternalResource page = new  ExternalResource("graph.html");
    BrowserFrame frame = new BrowserFrame("", page);
    setSizeFull();
    addComponent(frame);
}

protected void init(){
    ExternalResource page = new  ExternalResource("graph.html");
    BrowserFrame frame = new BrowserFrame("", page);
    setSizeFull();
    addComponent(frame);
}

然后，如果我更改

frame.setSizivel（）

的

setSizivel（）

，则该框架如下所示：

---

对不起，我什么也看不见。你最好在问题中加入更多的信息。更好的是：创建一个。只需删除不必要的代码并创建虚拟组件来演示布局代码。这将非常容易检查和调查。谢谢你的回答。我尝试将

GraphViewer

组件大小设置为100%，但得到的结果如下：（红色：视图大小，绿色：帧大小）前一个图像的代码如下：protectedvoid init（）{ExternalResource page=new ExternalResource（“graph.html”）；BrowserFrame=new BrowserFrame（“，page）；setSizivel（）；addComponent（frame）；}然后，如果我更改

frame.setSizivel（）

的

setSizivel（）

的

。另外，请检查
GraphViewer
layout的边框。对不起，无法看到任何内容。你最好在问题中加入更多的信息。更好的是：创建一个。只需删除不必要的代码并创建虚拟组件来演示布局代码。这将非常容易检查和调查。谢谢你的回答。我尝试将
GraphViewer
组件大小设置为100%，但得到的结果如下：（红色：视图大小，绿色：帧大小）前一个图像的代码如下：protectedvoid init（）{ExternalResource page=new ExternalResource（“graph.html”）；BrowserFrame=new BrowserFrame（“，page）；setSizivel（）；addComponent（frame）；}然后，如果我更改
frame.setSizivel（）
的
setSizivel（）
的
。此外，请检查
GraphViewer
layout的边框。您可以使用问题下的“编辑”按钮添加其他信息。您可以使用问题下的“编辑”按钮添加其他信息。