2

据我了解,GWT 默认情况下不会创建精灵,除了一些旧浏览器。相反,它将图像作为字符串存储在 javascript 代码中的某处或其他地方。听说要换房...

<set-property name='ClientBundle.enableInlining' value='false' /> 

...将强制 GWT 从我提供的图像资源中生成image sprites(即由小图标组合而成的大图像)。

问题是:

1)我可以强制GWT使用我们的设计师为我创建的自己的精灵文件,而不是自动生成这样的文件吗?

GWT2)根据您的经验,处理图像的最佳方式是什么?

4

1 回答 1

0

为您的捆绑图像创建资源:

interface MyResources extends ClientBundle {
  @Source("mySpriteImage.png")
  ImageResource mySpriteImage();

  @Source("myCss.css")
  MyCssResource myCss();
}

interface MyCssResource extends CssResource {
  String myBackground();
}

所以现在有两种方法可以使用从 MyResources 获取的 ImageResource。第一种是使用@sprite 指令将其附加到CSS 规则。myCss.css:

@sprite .myBackground {
  gwt-image: "mySpriteImage";
}
.image1 {
  width: 16px;
  height: 16px;
  background-position: 0 0;
}
.image2 {
  width: 16px;
  height: 16px;
  background-position: -16px 0;
}
.image3 {
  width: 32px;
  height: 32px;
  background-position: -16px -16px;
}
/* ... */

你创建你的精灵类并设置你的类名。

<ui:UiBinder> <!-- Preamble omitted for this example. -->
  <ui:with field="myResources" type="com.mycompany.MyResources"/>

  <g:Image styleName="{myResources.myCss.myBackground} {myResources.myCss.image1}"/>
</ui:UiBinder>
于 2013-10-16T13:15:29.880 回答