Question

我正在使用gwt在表格单元格中显示图像，它是一个动态图像，因此我不需要对其进行硬编码，但是它没有显示其中的实际图像。这是我的代码..

我的UiBinder有点像：

    <table>
       <tr><td ui:field="tableCellElement"/></tr>
    </table>

我的演示者正在使用方法访问该元素：

    void someMethod(Image patterImage) {
        tableCellElement.setBackgroundImage("url('"+patternImage.getUrl()+"')");
        // and I have tried this without using url as well but it doesn't work
        // DOM.setstyleattribute also doesn't work...
    }

代码执行成功，但没有显示图像，我目前正在使用IE9，但我也在IE8和7上尝试过。

我知道它可以用css解决但是这里我们的图像是动态的，所以如果我们有100个图像，我就不能为每个图像定义100个css ..

如果有人能为我解决这个问题，我真的很感激。

Answer 1

你的代码基本上没问题。您没有看到图像的原因可能只是td的默认大小为0.

背景图像不会影响元素的大小，因此您需要手动设置它。如果所有图像的大小相同，您可以在UiBinder中设置一次：

<ui:style>
  .myTableCell {
    width: 32px;
    height: 32px;
  }
</ui:style>

...

<table>
  <tr>
    <td class="{style.myTableCell}" ui:field="tableCellElement"></td>
  </tr>
</table>

否则，以编程方式设置：

Style style = tableCellElement.getStyle();

style.setBackgroundImage("url('"+patternImage.getUrl()+"')");
style.setWidth(patternImage.getWidth(), Unit.PX);
style.setHeight(patternImage.getHeight(), Unit.PX);

GWT TableCellElement未显示背景图像

1 个答案: