如何使用UIBinder混合HTML和GWT小部件？

Question

我们有一个使用UIBinder构建的现有用户界面，其中ui.xml文件包含以下层次结构：

<ui:UiBinder>
<div>
Multiple <span> or <a> separated by verbatim HTML (like | separators).

我需要用列表框替换其中一个锚点。

有没有一种方法可以在不替换div为HTMLPanel并更改所有锚点的情况下进行这种转换？

如果我尝试将gwt:ValueListBox或gwt:ListBox放入其中，我会收到错误消息，说我不能混合使用两者。我也不能在UIBinder下有多个子元素（例如div和HTMLPanel）。

如果我的唯一选择是将所有内容转换为widgets，那么对于a和ul项目，适当的转换是什么？

- Uri

---

为什么不将HTMLPanel添加到绑定器中，然后将您的div和其余HTML放在其中呢？ - jonasr

Answer 1

在UIBinder中，HTMLPanel可以包含HTML元素和GWT小部件，但是HTML元素只能包含其他HTML元素。

只需将顶层的div替换为HTMLPanel，然后仅将特定的<a>锚替换为gwt:ListBox即可。

- Peter Knego

---

当然，在你的Java代码中，你可能需要扩展Composite并使用initWidget而不是继承Widget和setElement。 - Thomas Broyer

从HTMLPanel javadoc中翻译： "一个包含HTML的面板，可以将子小部件附加到该HTML中标识的元素上。" - 这表明HTML元素实际上可以包含小部件。 - klarki

Answer 2

像这样

<gwt:HTMLPanel>
    <div align="center">
        <gwt:VerticalPanel res:styleName="style.background">

- piyush joshi