GWT: How to access in one stylesheet constants defined in another stylesheet from the same ClientBundle
This problem is best described with an example.
I have the following ClientBundle in my GWT app:
interface Resources extends ClientBundle {
public static final Resources INSTANCE = GWT.create(Resources.class);
@Source("defines.css")
Defines defines();
@Source("appStyle.css")
@CssResource.NotStrict
Style style();
interface Style extends CssResource {
String appLogo();
(...)
}
interface Defines extends CssResource {
String formInputBackgroundColor();
String formInputBorderColor();
(...)
}
}
The appStyle.css
is the main stylesheet used by the application and the defines.css
is a stylesheet containing only constants like:
@def formInputBackgroundColor #D8ECFD;
@def formInputBorderColor #7FAAFF;
(...)
Now I can use the constants in the defines.css
stylesheet inside UIBinder templates and in application code without problems, but I can't use those constants in my appStyle.css
.
I have already tried replacing interface Style extends CssResource
wit开发者_开发百科h interface Style extends Defines
, hoping that inheriting from the Defines
stylesheet would give me access to the constants in the "child" Style
stylesheet, but then the GWT compiler complains with errors like:
Rebinding my.project.client.resources.Resources
Creating assignment for style()
Replacing CSS class names
The following obfuscated style classes were missing from the source CSS file:
formInputBorderColor: Fix by adding .formInputBorderColor{}
formInputBackgroundColor: Fix by adding .formInputBackgroundColor{}
(...)
Is there any way to achieve this?
I found a way to do it, but it's far from elegant and I would prefer another solution, like using some kind of inheritance or Annotations, if possible.
The way I got it to work is to @eval
every constant I need from defines.css
in the appStyle.css
stylesheet, but that leads to a lot of code duplication and it's a mess to mantain.
@eval formInputBackgroundColor Resources.INSTANCE.defines().formInputBackgroundColor();
@eval formInputBorderColor Resources.INSTANCE.defines().formInputBorderColor();
If you have a better solution, please share.
Replacing
@Source("appStyle.css")
with
@Source({"defines.css", "appStyle.css"})
should do the trick. By specifying both css files your style()
will be a union of the two.
精彩评论