4

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 パターンを使用することは可能ですか?

4

2 に答える 2

7

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>

これは私のニーズにぴったりです。

于 2010-11-12T22:54:15.133 に答える
4

これらの定数をあるクラスで定義してから、ランタイム置換を使用して、使用する予定の各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>

テクニックの名前が「ランタイム置換」であっても、の値はコンパイル時に評価できるroyalBlueため、GWTコンパイラは文字列リテラルに置き換えられることに注意してください。royalBlue

CSSリソースで実行できるさらに優れた機能については、 http：//code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html#CssResourceをご覧ください。

于 2010-11-12T22:23:58.367 に答える