2

将 UiRenderer 与 GWT 2.5 一起使用时，如何更改 Span HTML 元素的样式？我已经设置了一个要在 CellTable 中使用的简单单元格。ui.xml 看起来像这样：

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder">
<ui:with field='stkval' type='java.lang.String'/>
<ui:with field='stkchg' type='java.lang.String'/>
<ui:with field='res' type='com.mycompanyclient.client.Enres'/>

<div id="parent">
    <span><ui:text from='{stkval}'/></span>.
    [<span class="{res.newstyle.positive}" ui:field="signSpan">
        <ui:text from='{stkchg}'/>
    </span>]
</div>
</ui:UiBinder>

现在，当这个单元格由 CellTable 实例化时，我希望signSpan根据传递给render函数的值来更改要更改的类名。我的 java 代码看起来像这样：

public class IndCell extends AbstractCell<QuoteProxy>  {

@UiField
SpanElement signSpan;
@UiField(provided=true)
Enres res = Enres.INSTANCE;

interface MyUiRenderer extends UiRenderer {
    SpanElement getSignSpan(Element parent);
    void render(SafeHtmlBuilder sb, String stkval,String stkchg);
}
private static MyUiRenderer renderer = GWT.create(MyUiRenderer.class);

public IndCell() {
    res.newstyle().ensureInjected();
}


@Override
public void render(com.google.gwt.cell.client.Cell.Context context,
        QuoteProxy value, SafeHtmlBuilder sb) {
            if (value.getChangeSign().contentequals('d')) {
    renderer.getSignSpan(/* ?? */).removeClassName(res.newstyle().negative());
            renderer.getSignSpan(/* ?? */).addClassName(res.newstyle().positive());
            }
    renderer.render(sb, value.getAmount(),value.getChange());
}

如果我尝试直接使用 UiField，它将设置为 Null。这是有道理的，因为我没有createandbindui像调用 UiBinder 那样调用函数。看起来很有希望，renderer.getSignSpan但我不知道要为父母传递什么。我能找到的所有示例都使用 aevent来识别父级。但我不想点击生成的单元格。

有没有办法在渲染方法中改变样式？

4

2 回答 2

1

我只是想我会为那些仍在为此苦苦挣扎的人提供一个示例解决方案。如果您想在渲染之前设置样式，例如将正值渲染为“绿色”，将负值渲染为“红色”，您可以执行以下操作：

这将是您的单元格类：

import com.google.gwt.cell.client.AbstractCell;
import com.google.gwt.core.client.GWT;
import com.google.gwt.safehtml.shared.SafeHtmlBuilder;
import com.google.gwt.uibinder.client.UiRenderer;

public class ExpenseInfoCell extends AbstractCell<YourClassProxy> {

    interface ExpenseInfoCellUiRenderer extends UiRenderer {
        void render(SafeHtmlBuilder sb, String cost, String newStyle);

        ValueStyle getCostStyle();
    }

    private static ExpenseInfoCellUiRenderer renderer = GWT
            .create(ExpenseInfoCellUiRenderer.class);

    @Override
    public void render(Context context, YourClassProxy value, SafeHtmlBuilder sb) {

        String coloredStyle = (value.getCost() < 0) ? renderer.getCostStyle()
                .red() : renderer.getCostStyle().green();

        renderer.render(sb, value.getCost()),
                coloredStyle);
    }

}

这将是随附的 UiBinder xml 文件

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder">
    <ui:style field="costStyle" type="com.myproject.client.tables.MyValueStyle">
        .red {
            color: red;
        }

        .green {
            color: green;
        }
    </ui:style>

    <ui:with type="java.lang.String" field="cost" />
    <ui:with type="java.lang.String" field="newStyle" />
    <div>
        <span class='{newStyle}'>
            <ui:text from='{cost}' />
        </span>
    </div>
</ui:UiBinder>

另外，请注意 field="costStyle" 与“getCostStyle”类中的 getter 匹配。您必须遵循此命名约定，否则渲染器将抛出错误。

于 2013-09-01T17:17:11.473 回答
1

因为class元素的 不是常数，所以您需要将其作为参数传递给render方法，以便单元格render读取： 

public void render(Cell.Context context, QuoteProxy value, SafeHtmlBuilder sb) {
  renderer.render(sb, value.getAmount(), value.getChange(),
      value.getChangeSign().contentequals('d') ? res.newstyle.positive() : res.newstyle.negative());
}
于 2013-05-04T09:18:03.427 回答