1

我使用 uibinder 和 UiRenderer 创建了一个抽象单元格。我的数据源是一个列表的列表。让我们说汽车列表,每辆车都有一个模型列表。我将单元格添加到 CellList。每个单元格就像一张卡片,顶部有前进和后退按钮(我使用箭头图像并使用 uihandler 处理点击事件)和卡片显示模型的属性。单击时的前进和后退图像分别显示下一个和上一个模型。单击图像时,我无法更改模型名称(和其他 div)。

<ui:with field="model_name" type="java.lang.String" />


<ui:with field="leftArrow" type="com.google.gwt.safehtml.shared.SafeHtml" />
<ui:with field="rightArrow" type="com.google.gwt.safehtml.shared.SafeHtml" />



                <div>
                    <table width="100%" border="1" cellpadding="2" cellspacing="2"
                        bgcolor="#ffffff">
                        <tr valign="top">
                            <td>

                                <div ui:field="left" >
                                     <ui:safehtml from='{leftArrow}' /> 
                                </div>

                            </td>
                            <td>

                                 <div ui:field="model"><ui:text from="{model_name}" /></div> 


                            </td>
                            <td>

                                <div ui:field="right" >
                                    <ui:safehtml from='{rightArrow}' /> 
                                </div>

                            </td>
                        </tr>
                    </table>
                </div>

我不确定如何访问模型 div 中的文本。随后有更多的 div 在单击图像时其值/文本会发生变化。

public class NewCompCell extends AbstractCell<String> {

@UiField
String model_name;

@UiField
DivElement model;

static interface Images extends ClientBundle {
    @Source("LeftArrow.png")
    ImageResource LeftArrow();

    @Source("rightArrow.png")
    ImageResource rightArrow();
}

private Images images = GWT.create(Images.class);
private Renderer uiRenderer = GWT.create(Renderer.class);

public static interface Renderer extends UiRenderer {

    void render(SafeHtmlBuilder sb, String value, String model_name,
            SafeHtml leftArrow, SafeHtml rightArrow);

    void onBrowserEvent(NewCompCell o, NativeEvent e, Element p, String n);

}

public NewCompCell() {

    super(BrowserEvents.CLICK);

}

@Override
public void onBrowserEvent(Context context, Element parent, String value,
        NativeEvent event,

        ValueUpdater<String> valueUpdater) {

    uiRenderer.onBrowserEvent(this, event, parent, value);

}

@Override
public void render(com.google.gwt.cell.client.Cell.Context context,
        String value, SafeHtmlBuilder sb) {

    uiRenderer
            .render(sb, value, value,
                    AbstractImagePrototype.create(images.LeftArrow())
                            .getSafeHtml(),
                    AbstractImagePrototype.create(images.rightArrow())
                            .getSafeHtml());
}

@UiHandler({ "right" })
void onRightArrowClicked(ClickEvent event, Element parent, String string) {

    model.setInnerText("next model");

}

@UiHandler({ "left" })
void onLeftArrowClicked(ClickEvent event, Element parent, String string) {

    model.setInnerText("previous model");

}

}

当我单击图像时,出现以下错误。

com.google.gwt.core.client.JavaScriptException: (TypeError) @com.google.gwt.core.client.impl.Impl::apply(Ljava/lang/Object;Ljava/lang/Object;Ljava/lang/Object ;)([JavaScript 对象(36),JavaScript 对象(2),JavaScript 对象(204)]):无法在 com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java 设置属性“textContent”为空:249) 在 com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:576) 在 com.google.com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:136)。 gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:284) 在 com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91) 在 com.google.gwt.core.client.impl。 Impl.apply(Impl.java) 在 com.google.gwt.core.client.impl.Impl.entry0(Impl.java:356) 在 sun.reflect.GeneratedMethodAccessor52.invoke(Unknown Source) at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source) at java.lang.reflect.Method.invoke(Unknown Source) at com.google.gwt.dev.shell .MethodAdaptor.invoke(MethodAdaptor.java:103) 在 com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71) 在 com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java :172) com.google.gwt.dev.shell.BrowserChannelServer.reactToMessages(BrowserChannelServer.java:293) com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:547) com.google。 gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:364) at java.lang.Thread.run(Unknown Source)DelegatingMethodAccessorImpl.invoke(Unknown Source) at java.lang.reflect.Method.invoke(Unknown Source) at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:103) at com.google.gwt.dev .shell.MethodDispatch.invoke(MethodDispatch.java:71) 在 com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:172) 在 com.google.gwt.dev.shell.BrowserChannelServer.reactToMessages(BrowserChannelServer .java:293) 在 com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:547) 在 com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:364) 在 java。 lang.Thread.run(未知来源)DelegatingMethodAccessorImpl.invoke(Unknown Source) at java.lang.reflect.Method.invoke(Unknown Source) at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:103) at com.google.gwt.dev .shell.MethodDispatch.invoke(MethodDispatch.java:71) 在 com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:172) 在 com.google.gwt.dev.shell.BrowserChannelServer.reactToMessages(BrowserChannelServer .java:293) 在 com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:547) 在 com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:364) 在 java。 lang.Thread.run(未知来源)103) 在 com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:172) 在 com.google.gwt 的 com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71) .dev.shell.BrowserChannelServer.reactToMessages(BrowserChannelServer.java:293) 在 com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:547) 在 com.google.gwt.dev.shell.BrowserChannelServer.run (BrowserChannelServer.java:364)在 java.lang.Thread.run(未知来源)103) 在 com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:172) 在 com.google.gwt 的 com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71) .dev.shell.BrowserChannelServer.reactToMessages(BrowserChannelServer.java:293) 在 com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:547) 在 com.google.gwt.dev.shell.BrowserChannelServer.run (BrowserChannelServer.java:364)在 java.lang.Thread.run(未知来源)processConnection(BrowserChannelServer.java:547) at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:364) at java.lang.Thread.run(Unknown Source)processConnection(BrowserChannelServer.java:547) at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:364) at java.lang.Thread.run(Unknown Source)

4

2 回答 2

0

UiBinder 中定义的 uiField 可以通过在 UiRenderer 中为该字段定义一个 getter 来访问。我收到错误是因为我试图直接访问 uifield。

public static interface Renderer extends UiRenderer {

    void render(SafeHtmlBuilder sb, String value, String model_name,
            SafeHtml leftArrow, SafeHtml rightArrow);
    DivElement getModel(Element parent); //make sure the uifield name matches the getter    

    void onBrowserEvent(NewCompCell o, NativeEvent e, Element p, String n);

}

该字段可以访问

    @UiHandler({ "right" })
void onRightArrowClicked(ClickEvent event, Element parent, String string) {

    uiRenderer.getModel(parent).setInnerText("next model");

}
于 2014-11-20T21:45:29.840 回答
0

实现这些要求的更简单的方法是创建自定义小部件,而不是自定义单元格。此自定义小部件(例如“CarCard”)可能包含两个图标、任意数量的标签等。它还将具有设置每个标签的文本的方法、左右箭头的单击处理程序等。您可以使用 UiBinder创建此自定义小部件。

然后,当您加载汽车列表时,您可以执行以下操作:

for (Car car : cars) {
    CarCard carCard = new CarCard();
    carCard.setCar(car);
    myContainerPanel.add(carCard);
}

自定义单元格在您需要渲染数据并根据单元格外部或整个单元格发生的事件(例如单击单元格本身)更新数据的情况下更有用。当您希望在单元格中具有类似小部件的行为时,这不是一个好的选择。

于 2014-11-20T16:15:35.020 回答