Question

I am trying to use Image loaded using Client Bundle in CSS, so i coded using CssResource as following, didn’t worked for me

ClientBundle Interface

public interface MyResources extends ClientBundle {
      @Source("tab_off_LT.png")
      DataResource image();

      @Source("my.css")
      MyCssResources css();
    }

CssResource Interface

public interface MyCssResources extends CssResource{

    String myImage();
}

CSS file

@url test1 image;
.myImage {
  background: 'test1';
  width: 50px;
}

Implementation code

RootLayoutPanel rp = RootLayoutPanel.get();
MyResources myr = (MyResources) GWT.create(MyResources.class);
myr.css().ensureInjected();
Label l = new Label("Test BackgroundImage");
l.setStyleName(myr.css().myImage());
rp.add(l);

Correct me if i am wrong anywhere in code, want to know where went wrong?

Answer 1

@url defines a variable (in your case named test1). The value of background in your code is a string literal, not a reference to the variable: remove the quotes.

@url test1 image;
.myImage {
   background: test1;
   width: 50px;
}

See https://developers.google.com/web-toolkit/doc/latest/DevGuideClientBundle#References_to_Data_Resources