0

在 GWTP 应用程序中，我有一个 TabLayoutPanel 嵌套在另一个 TabLayoutPanel 中。我为每个演示者/视图使用 UiBinder。

我没有在此处包含 UiBinder 行（抱歉），但我很难理解为什么嵌套 TabLayoutPanel 在两个选项卡行之间添加了一个额外的橙色薄未标记颜色块（见下图）。具有 VerticalPanel 而不是嵌套 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>

对于第三个选项卡，在 <g:header> 之后嵌套另一个 TabLayoutPanel 是否正确？

我的嵌套 TabLayoutPanel 直接用这种格式的每个选项卡定义：

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

Google Developer Tools 显示在此顶级 TabLayoutPanel 和嵌套的 TabLayoutPanel 之间插入了另一个带有 class="gwt-TabLayoutPabelTab get-TabLayoutPanelTab-selected" 的 DIV。这个额外的选项卡嵌套在具有“gwt-TabLayoutPanelTabs”类的 DIV 中。

这些额外的 DIV 在两行选项卡之间显示一个额外的块。

在此处输入图像描述

4

1 回答 1

0

当使用 VerticalPanel 并将所需的嵌套 TabLayoutPanel 放置在该 Vertical Panel 内时，可以避免虚假块。

在 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>

然后在 Teams 的 UiBinder 文件中：

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

通过添加“额外的”VerticalPanel，可以防止 GWT 添加额外的“幽灵”TabLayoutPanel。

于 2013-06-24T10:52:09.017 回答