GWT TabLayoutPanel不呈现图形内容

Question

GWT TabLayoutPanel不呈现图形内容

lal*_*lit 3 gwt uibinder 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>

Run Code Online (Sandbox Code Playgroud)

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

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

Run Code Online (Sandbox Code Playgroud)

在TabLayoutPanel之外我可以看到图形,但是如果我如上所示放置图形是不可见的.任何线索都会有所帮助.提前致谢.

Answer 1

Nat*_*ndy 9

为了使TabLayoutPanel正常工作,您需要确保以下内容:

1)您处于标准模式(使用<!DOCTYPE html>)
2)您正在使用GWT 2.0中的一个新布局面板作为TabLayoutPanel的父级.
或者
您明确指定TabLayoutPanel的高度(百分比将不起作用,您将不得不使用不同的单位).

TabLayoutPanel根据其*Layout容器的大小使用绝对定位.它不会自动填充正常父元素的空间(例如"div").因此,希望您可以简单地切换到使用其中一个*LayoutPanel作为父级(例如DockLayoutPanel).

如果使用*LayoutPanel不是一个选项:由于TabPanel不能在标准模式下工作(如果你想要跨浏览器兼容,你真的需要使用它)并且TabLayoutPanel不适用于流畅的布局,我我最终制作了自己的TabPanel版本并使用了它.如果您对制作自己的自定义小部件感到满意,并且无法使用其中一个*LayoutPanel,我建议您自己制作或扩展其中一个现有的小部件.

或者,您可以使用CSS或JavaScript将选项卡的内容区域从position:absolute更改为position:relative,但这对我来说似乎有点破解,并且可能会在将来中断.

Answer 2

amo*_*fis 5

我不知道它是否有帮助,但也许尝试使用<g:TabPanel>而不是<g:TabLayoutPanel>.我知道它已被弃用.

我也遇到了TabLayoutPanel的问题,但当我切换回TabPanel时它们就消失了.TabLayoutPanel有一些大小问题,例如不能放在div中,它必须"拥有"整个窗口,所以TabPanel与它完全不同.

归档时间：	15 年，5 月前
查看次数：	4332 次
最近记录：	15 年，5 月前