复制 GWT 的 TabLayoutPanel 的 <g:tab> 元素

Question

我发现 GWT 选项卡面板对于我需要做的样式来说很笨重，所以我正在尝试制作自己的简单选项卡面板。基本上是一个 HTML5 <nav> 标签元素和一个 DeckPanel 显示内容。让用户用 CSS3 解决剩下的问题。

GWT TabLayoutPanel 有这些“特殊”标签，用于定义选项卡的内容：

<g:TabLayoutPanel>
    <g:tab>
        <g:header>Tab Title</g:header>
        <g:OtherWidget>Tab contents</g:OtherWidget>
    </g:tab>
</g:TabLayoutPanel>

我指的是<g:tab> 和<g:header>。我看到这些类型的标签在不同的地方使用，但我不知道如何创建它们。查看 TabLayoutPanel 源代码，我看到它有一个 add 方法，该方法需要两个小部件，然后它将一个小部件（内容）放入面板中进行显示，将另一个（标题）放入 TabLayoutPanel.Tab 的实例中.但我不知道如何复制这种功能。

Answer 1

在 GWT 2.1 中有 UiChild attribute。这很酷。

@UiChild public void addTabDef(Widget page, String title) {...}

title 参数将在tabdef 标记中填充同名属性，如下所示：

<v:tabdef title="Tab one"><g:Label>Page one.</g:Label></v:tabdef>

编辑：要清楚，tabdef 没有在任何地方定义为类；解析期间所需的行为由 UiChild 属性定义。

Answer 2

要为您的小部件使用自定义标签，如<g:tab> 和<g:header>，您需要创建一个自定义 ElementParse 并将其注册到 UiBinderWriter。不幸的是，在不编辑 gwt 的源代码的情况下，还没有简单的方法可以做到这一点。

有用的链接：

A link to the issue of not being able to create custom ElementParser

TabLayoutPanelParser