使用默認GWT CSS類名稱的UiBinder內聯樣式不適用

Question

我正在使用GWT與UiBinder，我以某種方式無法管理得到默認的CSS樣式規則正常工作。

<ui:style> 
    .createButton { 
     background-color: red; 
    } 
</ui:style> 

<g:FlowPanel> 
    <g:Button styleName="{style.createButton}">Create</g:Button> 
</g:FlowPanel> 

但使用GWT默認的CSS類名的時候就像在下面的例子中，樣式不施加在所有的：到目前爲止，我已經成功地通過指定自定義的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來設置樣式，但按鈕類可能是一個更好的例子。 ）

Answer 1

.gwt-Button在ui:style會被混淆，因此不會被應用到class="gwt-Button"。

你必須將其標記爲@external它不被擾亂：

@external .gwt-Button; 

.gwt-Button { background-color: red; }