什麼是GWT嵌套TabLayoutPanel的顯示中的虛假塊？

在一個GWTP應用程序中，我有一個TabLayoutPanel嵌套在另一個TabLayoutPanel中。我爲每個演示者/視圖使用UiBinder。我很難看出爲什麼嵌套TabLayoutPanel在兩個標籤行之間添加了一個額外的橙色薄無標籤的顏色塊（見下圖）。具有VerticalPanel而不是嵌套TabLayoutPanel的頂級選項卡缺少額外的未標記橙色塊。什麼是GWT嵌套TabLayoutPanel的顯示中的虛假塊？

您之前是否遇到過此顯示？

我MainView.ui.xml看起來是這樣的：

<g:TabLayoutPanel barHeight="2" barUnit="EM"> 
<g:tab> 
    <g:header>Invite</g:header> 
    <g:VerticalPanel/> 
</g:tab> 

<g:tab> 
    <g:header>News</g:header> 
    <g:VerticalPanel/> 
</g:tab> 

<g:tab> 
    <g:header>Teams</g:header> 
    <g:TabLayoutPanel barHeight="2" barUnit="EM"/> 
</g:tab> 

</g:TabLayoutPanel>

對於第三個標籤，是不是正確的嵌套另一個TabLayoutPanel後<克：頭>？

我嵌套TabLayoutPanel是直截了當地用這種格式的每個選項卡中定義：

<g:tab> 
    <g:header>All Teams</g:header> 
    <g:VerticalPanel/> 
</g:tab>

谷歌開發者工具揭示了帶class =另一DIV「GWT-TabLayoutPabelTab GET-TabLayoutPanelTab選擇」插入這頂之間級別的TabLayoutPanel和嵌套的TabLayoutPanel。這個額外的選項卡嵌套在類爲「gwt-TabLayoutPanelTabs」的DIV中。

這些額外的DIV在兩行選項卡之間顯示額外的塊。當使用VerticalPanel避免

enter image description here

來源

2013-06-20 Carl

這些問題。最好的事情是使用Chrome開發工具進行檢查，看看這裏顯示的是什麼。如果沒有UiBinder代碼，很難說出問題所在。 –

雜散塊和所需的嵌套TabLayoutPanel被放置在垂直面板內。

在MainView.ui.xml代替：

<g:tab> 
    <g:header>Teams</g:header> 
    <g:TabLayoutPanel barHeight="2" barUnit="EM"/> 
</g:tab>

使用本：

<g:tab> 
    <g:header>Teams</g:header> 
    <g:VerticalPanel/> 
</g:tab>

，然後在團隊的UiBinder的文件：

<g:VerticalPanel> 
    <g:TabLayoutPanel ...> 
     <g:tab> 
      ...

通過添加「額外的「VerticalPanel一個可以防止GWT添加額外的」幻影「TabLayoutPanel。

來源

2013-06-24 10:52:09 Carl

什麼是GWT嵌套TabLayoutPanel的顯示中的虛假塊？

回答

相關問題