GWT-如何在uibinder xml文件的布局层次结构之外定义小部件

这是我的第一篇文章。我希望有人能帮助我。
我正在寻找一种在UiBinder XML布局文件中单独定义小部件的方法，而不属于布局层次结构的一部分。 下面是一个小例子：

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
xmlns:g="urn:import:com.google.gwt.user.client.ui">

<g:Label ui:field="testlabel" text="Hallo" />
<g:HTMLPanel>       
...
</g:HTMLPanel>

例如，在定义网格或FlexTable时，这可能很有用—我希望在XML布局文件中定义表头的标签，而不是在代码中以编程方式定义

---

事先非常感谢

对不起，不行，UiBinder不支持这种语法。想想看，这个小部件会去哪里？是否应将其添加到DOM树中？这也使得编译器很难判断此代码是否应作为未使用的代码进行修剪

您必须等待GWT团队为

Grid

创建自定义标记（例如，就像他们对所做的那样）。不过，我不希望FlexTable具有这样的功能，因为它是为动态内容设计的，意味着无论如何都要以编程方式添加它。

理解这一点是弄清楚如何干净地构造UiBinder模板的关键

因此，如果您只想创建一个小部件，而不是最初在DOM中创建它，那么在UiBinder模板中根本不需要提及它。相反，在UiBinder模板附带的Java文件中，创建它并将其添加到模板中定义的面板中

例如，将其放入模板中：

<g:HTMLPanel ui:field='container'>       
...

---

我不确定您是否有同样的异常动机将两个以上的根小部件放在uibinder标记下。不管怎样，我就是这样做的

由于uibinder标记只允许一个根小部件，所以我将一个HTMLUI标记作为根小部件，然后在该标记中堆积多个伪根小部件

在下面的示例中，请注意，实际的根小部件没有ui:field name，因为我们不打算使用它。就我们而言，有效的根部件是“tabLayout”和“content”

文件Hello.ui.xml：

<ui:UiBinder
  xmlns:ui="urn:ui:com.google.gwt.uibinder"
  xmlns:g="urn:import:com.google.gwt.user.client.ui">
  <g:HTML>
    <g:TabLayoutPanel ui:field="tabLayout"  ... >
      blah ... blah
    </g:TabLayoutPanel>
    <g:VerticalPanel ui:field="content">
      blah .. blah
    </g:VerticalPanel>
  </g:HTML>
</ui:UiBinder>

废话。。。废话
废话。。废话

不要将composite扩展为模板后面的java代码。 创建由模块入口点导入的类，或直接在模块上使用模板

我有各种各样的理由来解释为什么我需要不止一个根部件。在本例中，我有条件地附加“有效根小部件”：

public class Hello
  implements EntryPoint{

  private static HelloUiBinder uiBinder = GWT.create(HelloUiBinder.class);

  interface HelloUiBinder
    extends UiBinder<Widget, Hello>{}

  @UiField TabLayoutPanel tabLayout;
  @UiField VerticalPanel content;

  @Override public void onModuleLoad() {
    uiBinder.createAndBindUi(this);

    if (condition1)
      RootPanel.get().add(tabLayout);
    else
      RootPanel.get().add(content);

    blah ... blah 
  }
}

公共类你好
入口点{
私有静态HelloUiBinder uiBinder=GWT.create（HelloUiBinder.class）；
接口HelloUiBinder
扩展UiBinder{}
@UiField TabLayoutPanel tabLayout；
@UiField垂直面板内容；
@重写moduleload（）上的公共void{
uiBinder.createAndBindUi（这个）；
如果（条件1）
RootPanel.get（）.add（tabLayout）；
其他的
RootPanel.get（）.add（内容）；
诸如此类
}
}

---

因此，诀窍是根本不使用实际的根小部件。

您想实现什么？例如，如果你只是不想让testLabel出现，你可以给它分配一个样式名，这个样式名有一个CSS规则设置“display:none”。-1-因为每次你想使用一个“内部”小部件时，你也必须创建所有其他的小部件->浪费内存。room先生应该明白XML/HTML/UiBinder并不是要这样使用的。如果您有一些稍后要添加的元素，可以通过编程方式进行添加（参见jQuery之类的库-它们不会在HTML文件中的某个位置“放置”未来的HTML标记，您必须通过编程方式添加它们），或者将其提取到单独的小部件/UiBinder模板中。它不仅仅是一个div标记-取决于小部件，可能有许多事件处理程序、复杂模式等。您需要创建所有这些，只是为了只使用一部分-IMHO，这是一种浪费。我在模板后面的Java代码中使用了所有这些。只需将所有内容隐藏到一个模板中。讨厌看到同一个入口点有这么多模板。这是一个丑陋的模板激增，啊！和。。。。还有一个懒惰的面板，我还不需要。

<ui:UiBinder
  xmlns:ui="urn:ui:com.google.gwt.uibinder"
  xmlns:g="urn:import:com.google.gwt.user.client.ui">
  <g:HTML>
    <g:TabLayoutPanel ui:field="tabLayout"  ... >
      blah ... blah
    </g:TabLayoutPanel>
    <g:VerticalPanel ui:field="content">
      blah .. blah
    </g:VerticalPanel>
  </g:HTML>
</ui:UiBinder>

public class Hello
  implements EntryPoint{

  private static HelloUiBinder uiBinder = GWT.create(HelloUiBinder.class);

  interface HelloUiBinder
    extends UiBinder<Widget, Hello>{}

  @UiField TabLayoutPanel tabLayout;
  @UiField VerticalPanel content;

  @Override public void onModuleLoad() {
    uiBinder.createAndBindUi(this);

    if (condition1)
      RootPanel.get().add(tabLayout);
    else
      RootPanel.get().add(content);

    blah ... blah 
  }
}