UiBinderでGWTを使用していますが、どういうわけか、デフォルトのCSSスタイルルールを正しく機能させることができません。これまでのところ、次のようなカスタムCSSクラス名を割り当てることで、コンポーネントのスタイル設定に成功しています。
<ui:style>
.createButton {
background-color: red;
}
</ui:style>
<g:FlowPanel>
<g:Button styleName="{style.createButton}">Create</g:Button>
</g:FlowPanel>
ただし、次の例のようにGWTのデフォルトのCSSクラス名を使用する場合、スタイルはまったく適用されません。
<ui:style>
.gwt-Button {
background-color: red;
}
</ui:style>
<g:FlowPanel>
<g:Button>Create</g:Button>
</g:FlowPanel>
GWTがUiBinderクラス名を処理する方法と関係があると思います。UiBinderスタイル名を{style.createButton}に設定した後、Firebugを使用してWebアプリケーションのボタンを検査すると、ある種の難読化されたクラス名が使用されます。
class="GBMSFK0DJJ"
クラス名をまったく割り当てていない状態で検査すると、次のように表示されます。
class="gwt-Button"
ボタンのクラス名は正しいようですが、UiBinderスタイルセクションで定義したスタイルは適用されません。私は何かが足りないのですか、それともこれはバグですか?
(なぜボタンに独自のカスタムスタイル名を割り当てないのか疑問に思われるかもしれません。実際には.gwt-TreeItemを使用してTreeItemsのスタイルを設定しようとしていますが、ボタンクラスの方がおそらく良い例です。)