gwt - GWT TabLayoutPanel不呈现图形内容

我有一个类似于下面的结构

<g:TabLayoutPanel ui:field="rightTabPanel"
             width="100%" height="100%"
                     barUnit="EM" barHeight="3">
    <g:tab>
          <g:header>Graph</g:header>
                    <g:FlowPanel ui:field="graphContent"/>
     </g:tab>
      <g:tab>
           <g:header>Data</g:header>
                      <g:FlowPanel ui:field="dataContent"/>
     </g:tab>
 </g:TabLayoutPanel>

我有两个标签，其中一个显示图表，另一个标签显示
数据。但是，选项卡中的内容不可见。如果我放

<g:FlowPanel ui:field="graphContent"/>

我可以在TabLayoutPanel之外
看到图表，但是如果我按上图所示放置，则该图表不可见。
任何线索都会有所帮助。
提前致谢。

最佳答案

为了使TabLayoutPanel正常工作，您需要确保以下各项:

1)您处于标准模式(使用)
2)您正在使用GWT 2.0中的新版式面板之一作为TabLayoutPanel的父级。
要么
您显式指定TabLayoutPanel的高度(百分比将不起作用，您将不得不使用其他单位)。

TabLayoutPanel使用基于其* Layout容器大小的绝对定位。它不会自动填充正常父元素(例如“div”)的空间。
因此，希望您可以简单地切换为使用* LayoutPanels之一作为父项(例如DockLayoutPanel)。

如果不是使用* LayoutPanel选项:由于TabPanel在标准模式下不起作用(如果您希望跨浏览器兼容，则必须使用该模式)，并且TabLayoutPanel在流畅的布局中不能很好地工作，我最终制作了自己的TabPanel版本并改为使用该版本。如果您对制作自己的自定义窗口小部件感到满意，并且不能使用* LayoutPanels之一，则建议您制作自己的窗口小部件或扩展现有的窗口小部件之一。

另外，您可以使用CSS或JavaScript将选项卡的内容区域从position:absolute更改为position:relative，但这对我来说似乎有点不足，并且将来可能会中断。