0

在 MyPanel.ui.xml 中：

<button class="btn" ui:field="myButton">Save</button>

在 MyPanel.java 中：

public class MyPanel extends Composite {
    ...
    @UiField ButtonElement myButtonUi;
    ...
    public MyScreen() {
        final HTMLPanel panel = uiBinder.createAndBindUi(this);
        initWidget(panel);
        Button myButton = Button.wrap(myButtonUi);

在 MyEntryPoint.java 中：

if (....)
    RootPanel.get().add(new MyPanel());

所以我想我不太了解如何使用 UiBinder。

我打算将 HTML 与 ui:field=".." 一起使用，以便网页设计师可以在 UI 字段上设置 class="xx" 之类的内容。大多数 GWT 文档都假定您有一个 Button 而不是 ButtonElement。但是如果我使用 Button 我需要<g:Button>在 HTML 文档中有一个，这意味着我的网页设计师不能设置类？我的意思是 UiBinder 的目的是允许人们使用普通的 HTML 并将其与 GWT 代码集成？

当我执行上述操作时，在换行线上，我在开发模式下从以下位置获得 NullPointerException：

public static Button wrap(com.google.gwt.dom.client.Element element) {
    // Assert that the element is attached.
    assert Document.get().getBody().isOrHasChild(element);

在生产模式下，它似乎工作正常。在 Eclipse 的开发模式调试器中，当我右键单击并“检查”表达式“Document.get().getBody()”时，Eclipse 显示“无法向非类类型对象发送静态消息”。

我应该怎么办？是否因为我需要先附加元素而发生空指针异常？如果是这样，怎么做？（我已经在调用 createAndBindUi 并且传递给 wrap 的元素是非空的）。

4

2 回答 2

1

所以最后，这就是答案。我编辑了它并删除了无用的评论。

如果您的计划是使用 UiBinder 将组件从 ui.xml 连接到视图的 Java 代码，则不能在 ui.xml 中使用 HTML。代替

<button class="btn" ui:field="myButton">Save</button>

利用

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder' xmlns:g='urn:import:com.google.gwt.user.client.ui'>
<g:Button styleName="btn" text="Save" ui:field="myButton"/>

然后在您的视图中 -java 代码 - 只需键入

@UiField com.google.gwt.user.client.ui.Button myButton;

public MyScreen() {
    final HTMLPanel panel = uiBinder.createAndBindUi(this);
    initWidget(panel);
}

而已。

“styleName”属性足以让您的设计师挂钩 CSS 类。这篇其他帖子可能会让您感兴趣。设计人员必须了解哪些属性在哪些组件上可用。使用 UiBinder 不像使用 HTML 那样简单。

UiBinder 不是用于编写 HTML，而是编写 GWT 可以理解并编译为 javascript（反过来会生成页面的 HTML）的 XML。它不像 JSP 机制，您可以立即插入纯 HTML。

当您必须将 ui 元素（来自 ui.xml 的小部件或组合）与您的 Java 视图代码（即使用 @UiField 或 @UiHandler 注释）连接时，UiBinder 最有用。

于 2013-08-12T15:03:54.030 回答
1

您可以使用 HTML。唯一的限制是它g:Button必须在像g:HTMLPanel. 好处g:HTMLPanel是它可以呈现 HTML。

请参见下面的示例：

<g:HTMLPanel>       
    <div>
    test
    </div>

    <table border="1">
    <th>
        button
    </th>
    <tr>
    <td>    
    <g:Button styleName="{style.important}" ui:field="button"/>
    </td>
    </tr>
    </table>

    <div>
    test
    </div>      
</g:HTMLPanel>

于 2014-07-31T14:46:11.773 回答