いくつかの UI Binder テンプレートで同じスタイルを使用する必要があるため、https ://developers.google.com/web-toolkit/doc/latest/DevGuideUiBinder#Using_an_external_resource の説明に従ってすべてを行いました。
だから私は次のことをしました:
1. 作成されたリソース インターフェイス:
パブリック インターフェイス リソースは ClientBundle を拡張します {
@Source("shared.css")
スタイル style();
public interface Style extends CssResource {
文字列 grayedOut();
}
}
2. shared.cssResources クラスと同じディレクトリにファイルを作成します。
。グレーアウト{
背景色: 赤;
}
3. withUI Binder テンプレートに次の要素を
追加しました。<ui:with type="correct.package.Resources" field="res"/>
4. UI Binder テンプレートのスタイルへの参照を追加:addStyleNames="{res.style.grayedOut}"
しかし、うまくいきません。grayedOut スタイルがまったく適用されていないのと同じように、ビューがレンダリングされます。
しかし、私は2つのことを観察しました:
- Firebug/Chrome Dev Tools では、追加しようとしているスタイルに対応する使い古されたスタイル名が要素に割り当てられていることがわかります
class="GAWERH0MI gwt-TabLayoutPanelContent"(GAWERH0MI私のクラスに対応しているようですgrayedOut)が、「要素スタイル」パネルで見つけることができません。おそらく、このクラスが空 (本体なし) であることを意味します。(私は実験を行い、そのツールで同じ効果を持つ要素に空のクラスを割り当てました)。 - .css でスタイル名を変更すると、スタイル
grayedOutが見つからないというランタイム エラーが発生します。これは、スタイル クラスが正常に検出されたにもかかわらず、何らかの理由で期待どおりに動作しないことを意味しているようです。