Question

使用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模式？

Answer 1

重新阅读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>

这非常适合我的需求。

Answer 2

在某些类中定义这些常量可能符合您的最佳利益，然后使用运行时替换在您打算使用的每个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

在GWT UiBinder样式中访问CSS常量

2 个答案: