4

I'm trying to use CssResource and ImageResource together in a GWT2.2 project.

CssResource and obfuscation are working properly, but I'm having problems accessing images.

I already can access the images through ImageResource directly from the ui.xml files in the following way:

<ui:with type="com.example.client.resource.ResourceBundle" field="myResource"/>
<g:Image resource="{myResource.image}"/>

But I cannot attach ImageResource from within external .css files using @sprite.

I have the following interfaces:

public interface ResourceBundle extends ClientBundle {
ResourceBundle INSTANCE = GWT.create (ResourceBundle.class);

    @Source("com/example/client/resource/images/image.png")
    ImageResource image();

    @Source("com/example/client/resource/css/mystyle.css")
    MyCssResource myCssResource();
    }

public interface MyCssResource extends CssResource {
    String className();
}

And when I add the sprite to the css file,

@sprite .className {
    gwt-image: 'image';
}

I got the following error message:

[ERROR] - Unable to find ImageResource method value("image") in
com.example.client.views.MyView_BinderImpl_GenBundle : Could not find 
no-arg method named image in type com.example.views.MyView_BinderImpl_GenBundle
Andres
  • 1,484
  • 19
  • 29
  • Are you referencing `mystyle.css` from anywhere other than your ClientBundle? Do you have a `` reference in `MyView.ui.xml`? – Jason Terk Apr 05 '11 at 15:12
  • Yes, I am referencing mystyle.css from both, the ClientBundle and the UiBinder. I have the following reference: `` Do I need to reference it from other places also? – Andres Apr 05 '11 at 15:48

1 Answers1

2

You can access your styles from UiBinder templates as follows:

<ui:with type="com.example.client.resource.ResourceBundle" field="myResource"/>

<g:FlowPanel styleName="{myResource.myCssResource.className}"/>
Jason Terk
  • 6,005
  • 1
  • 27
  • 31
  • Yep, I already access the `ImageResource` from my `UiBinder` in the same way you are showing here. But what I cannot do now is access the ImageResource from external .css files, as is shown in the [CssResourceCookBook](http://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html#CssResourceCookbook) section **Background images / Sprites** – Andres Apr 05 '11 at 16:52
  • Can you post the contents of `MyView.ui.xml` in your question? I'll show you how to fix it. – Jason Terk Apr 05 '11 at 17:03
  • Well, as I wrote in the original question, I can access the `ImageResource` from MyView.ui.xml in the following way: ` ` And also don't have problems assigning style class names from the CssResource: `` The problem arises when trying to set a `background-image` property in the file `mysstyle.css` using the @sprite notation. – Andres Apr 05 '11 at 18:12
  • 2
    You need to access the CssResource through the UiBinder template's reference to the ClientBundle - it won't work if you load the CSS file with ``. So instead of `` you will use ``. – Jason Terk Apr 05 '11 at 18:38
  • Great! I have it working now. Thanks a lot @Jason! Just a detail; in your last comment it should said `` – Andres Apr 05 '11 at 19:36
  • 4
    Just a note to say that `@sprite` work OK in ``, as UiBinder just generates an implicit `ClientBundle` and `CssResource` out of it. The way to add an `ImageResource` to that implicit `ClientBundle` (the `*_GenBundle` in the error message) is to use a `` in the `ui.xml`. There's also `` to generate a `DataResource`. – Thomas Broyer Apr 06 '11 at 22:01
  • Thanks @Thomas. Actually, if I understood correctly, ui:image doesn't use an ImageResource, you have to specify a relative path to the image name, you cannot reference the resource itself. It sucks because it gets in the way of refactoring, abstracting paths, etc. See http://code.google.com/p/google-web-toolkit/issues/detail?id=5320 bug about the issue. If I missed something about ui:image, I would be glad to be corrected! ^_^' – PhiLho Feb 03 '12 at 11:52