Can I use GWT image help using ImageBundle to work in IE7 and IE6?

Question

I am trying to use ClientBundle in my GWT application to send multiple images as a single file. I declare a bunch as follows:

public interface MyResources extends ClientBundle {
  public static final MyResources INSTANCE = GWT.create(MyResources.class);

  @Source("icon1.png") ImageResource icon1();
  @Source("icon2.png") ImageResource icon2();
}

This works fine in Firefox and IE8, but in IE7 (and earlier) the whole sprite appears instead of one of my source images, i.e. icon1 is next to icon2 next to icon3, etc. In IE8 developer tools using IE8-as-IE7 mode or compatibility view, I see that it shows an image with a file name such as 26BEFD2399A92A5DDA54277BA550C75B.cache.png, as I expected.

So, is there a way to make GWT help sprites work in IE7 and below? If not, is there a way to gracefully degrade, so users of other browsers get writing faster, and IE7 and IE6 users get something that looks right, but slower?

: Bundle Client ClientBundle @sprite : IE6 , DOM "". ie6 ie7 user.agent, ie6. , ie6 , ". , , ? - " ", .

2: , :

public class MyTabHeader extends Composite {
  @UiField Image icon;

  public MyTabHeader(String iconPath) {
    initWidget(uiBinder.createAndBindUi(this));
    this.icon.setUrl(iconPath);
  }
}

public class MyTabPanel extends TabPanel {
  public MyTabPanel() {
    String icon1 = MyResources.INSTANCE.icon1().getURL();
    MyTabHeader tabHeader1 = new MyWidget(icon1);
    Widget tabContent1 = new HTML("Content 1");
    add(tabContent1, tabHeader1);

    String icon2 = MyResources.INSTANCE.icon2().getURL();
    MyTabHeader tabHeader2 = new MyWidget(icon2);
    Widget tabContent2 = new HTML("Content 2");
    add(tabContent2, tabHeader2);
  }
}

Answer 1

Image.setUrl(MyResources.INSTANCE.icon1(). getUrl()) .

Image.setResource(MyResources.INSTANCE.icon1())

Answer 2

ImageResource?

, , , CssResource @sprite.

, Image , IE6 + 7

Answer 3

IE7, , , "getUrl()", . .. - ( ):

this.icon.setUrl(MyResources.INSTANCE.icon1().getURL());

:

this.mypanel.getElement().getStyle().setBackgroundImage("url("+MyResources.INSTANCE.icon1().getURL()+")");

- "this.icon.setResource(MyResources.INSTANCE.icon1())", , , IE8 . IE7 (, , ).

So, is there a way to set the background image using the image from the GWT ResourceBundle so that it works correctly in IE7?

Answer 4

You can use DataResource with IE7

if( BrowserUtils.getIEVersionNumber() < 8 && BrowserUtils.isBrowserIE()){
    icon = new Image(resources.iconIE().getSafeUri());
} else {
    icon = new Image(resources.icon());
}
...
in client bundle: 

@Source("icon.png")
DataResource iconIE();

@Source("icon.png")
imageResource icon();