在UIBinder中的纯HTML元素中使用ClientBundle图像资源

Question

基于以下资源：

http://www.gwtproject.org/doc/latest/DevGuideClientBundle.html

Use ClientBundle image as background-image

我已在UIBinder模板中成功实现了GWT <g:Image>图像资源：

<ui:with field='res' type='com._.client.resources.Resources'></ui:with>
<g:Image resource="{res.menuLogo}" altText="" styleName="{style.menuLogo}"/>

但是，我试图将图像添加为<g:MenuItem>的子元素，在GWT中只能将纯HTML元素作为子元素添加：

<g:MenuItem>
    <img id="revealIcon" src="images/trianglebuttonWHITE-DOWN.png" width="11"/>
</g:MenuItem>

该图片用于小部件，当子菜单处于活动状态时，该部件将发生变化。

我的目标是通过ClientBundle处理所有资源，并避免在WAR目录中拥有任何资源。

我可以为纯HTML <img>图片引用ClientBundle资源吗？

我应该以编程方式和/或使用CSS Image Sprites来执行此操作吗？

Answer 1

<img id="revealIcon" src="{res.menuLogo.getSafeUri}" width="11"/>

请注意，为了安全起见，您应该使用DataResource而不是ImageResource，因为从技术上讲，ImageResource可以与其他图片捆绑在一起，并且仅代表一个区域更大＆＃34; sprited＆＃34;图像（在这种情况下，ImageResource将是ImageResourcePrototype.Bundle的实例，但无法在UiBinder中检查它。