以 GWT UiBinder 样式访问 CSS 常量

发布于 2024-10-02 08:32:19 字数 713 浏览 1 评论 0原文

使用 GWT 2.1，我尝试创建一个包含大量常量和常见样式的 CSS 文件。我想使用 ui:style 标签将其包含在 UiBinder 模板中：

<ui:UiBinder
  xmlns:ui='urn:ui:com.google.gwt.uibinder'
  xmlns:g='urn:import:com.google.gwt.user.client.ui'

  <ui:style field="css" src="constants.css" />
</ui:UiBinder>

我可以轻松地利用元素的样式：

<g:FlowPanel styleName="{css.panel}">...</g:FlowPanel>

但是尝试在另一个 Style 块中使用常量失败：

<ui:Style>
  .templateSpecificStyle {
      background-color: {css.royalBlue};
      padding: 1em;
  }
</ui:Style>

奇怪的是，我没有收到编译错误。创建了混淆的 CSS 类；但是，内容是空的。有没有办法在另一个 Style 块中访问这些 CSS 常量？是否可以使用旧的 ResourceBundle / CssResource 模式？

原文

Using GWT 2.1, I am trying to create a CSS file that contains numerous constants and common styles. I would like to use the ui:style tag to include it in the UiBinder template:

<ui:UiBinder
  xmlns:ui='urn:ui:com.google.gwt.uibinder'
  xmlns:g='urn:import:com.google.gwt.user.client.ui'

  <ui:style field="css" src="constants.css" />
</ui:UiBinder>

I can easily utilize the styles for elements:

<g:FlowPanel styleName="{css.panel}">...</g:FlowPanel>

But attempting to use the constants in another Style block fails:

<ui:Style>
  .templateSpecificStyle {
      background-color: {css.royalBlue};
      padding: 1em;
  }
</ui:Style>

Oddly I do not receive a compile error. The obfuscated CSS class is created; however, the content is empty. Is there any way to access these CSS constants within another Style block? Is it possible using the older ResourceBundle / CssResource pattern?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

泪意 2024-10-09 08:32:19

重新阅读 https://stackoverflow.com/questions/3533211/need-app-wide-css-constants-in-gwt/4143017#4143017 我发现如果您在样式块：

<ui:Style src="constants.css">
  .templateSpecificStyle {
      background-color: royalBlue;
      padding: 1em;
  }
</ui:Style>

这非常适合我的需求。

After re-reading https://stackoverflow.com/questions/3533211/need-app-wide-css-constants-in-gwt/4143017#4143017 I see that the constants work if you add the template specific style within the style block:

<ui:Style src="constants.css">
  .templateSpecificStyle {
      background-color: royalBlue;
      padding: 1em;
  }
</ui:Style>

This is perfect for my needs.

回复收藏 0 原文

扎心 2024-10-09 08:32:19

在某个类中定义这些常量可能符合您的最佳利益，然后使用运行时替换将此常量包含在您打算使用的每个 CSS 资源中。

CSSConstants.java

package com.foo.client;
public final class CSSConstants {
    public static final String ROYAL_BLUE = "#4169E1";
}

UiBinder 模板中的样式块

<ui:style>
  @eval royalBlue com.foo.client.ROYAL_BLUE
  .templateSpecificStyle {
    background-color: royalBlue
  }
</ui:style>

请注意，即使该技术的名称是“运行时替换”，GWT 编译器也会将 royalBlue 替换为字符串文字，因为可以在编译时评估 royalBlue 的值。

如需在 CSS 资源中执行更酷的操作，请查看 http ://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html#CssResource

It may be in your best interest to define these constants in some class, then use runtime substitution to include this constant in each CSS resource you intend to use.

CSSConstants.java

package com.foo.client;
public final class CSSConstants {
    public static final String ROYAL_BLUE = "#4169E1";
}

Style block in UiBinder template

<ui:style>
  @eval royalBlue com.foo.client.ROYAL_BLUE
  .templateSpecificStyle {
    background-color: royalBlue
  }
</ui:style>

Note that even the name of the technique is "runtime substitution", the GWT compiler will replace royalBlue with a string literal because the value of royalBlue can be evaluated at compile time.

For more cool stuff that you can do in CSS resources, take a look at http://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html#CssResource

回复收藏 0 原文

~没有更多了~