如何在GWTP中正確使用CSS？

很難找到如何在Internet上正確使用CSS的完整循序漸進指南。如何在GWTP中正確使用CSS？

我使用日食& GWTP打造我的應用程序&我想設置一些簡單的CSS樣式爲我的小部件（按鈕，文本框...）。

好吧，這裏是我的了：一個TestPresenter.java，TestView.java & TestView.ui.xml

-In TestView.ui.xml：

<ui:UiBinder .....> 
    <ui:style src='myStyle.css' /> 
    <g:HTMLPanel> 
    <g:Button text="My But 1" addStyleNames="{style.myBut}" ui:field="myBut1"/> 
    <g:Button text="My But 2" ui:field="myBut2"/> 
    </g:HTMLPanel> 
    </ui:UiBinder>

myStyle.css是在同一容納TestPresenter.java，TestView.java & TestView.ui.xml

-TestPresenter.java文件夾（具有2 buttons- myBut 1 & myBut 2）：我添加「myBut」爲myBut2

getView().getMyBut2().addStyleName("myBut");

運行後，顯示2個按鈕，第一個myBut1獲得了正確的CSS，但myBut2仍顯示默認的Css。我改爲getView().getMyBut2().setStyleName("myBut");，但它仍然沒有工作。

所以我想我可能在這裏錯過了一些類&這就是爲什麼eClipse無法識別「myBut」CSS以便它可以申請myBut2。

所以，如何讓myBut2在eClipse中顯示正確的Css？

來源

2013-07-15 Tum

原因是將CSS樣式表作爲源添加到uibinder會導致gwt編譯器爲其生成CssResource類，因此會將CSS類名稱混淆爲SHA1哈希值。這意味着，在最終的編譯版本中，而不是「.myBut」，你實際上最終會得到類似「.XYZXYZ」的東西。

這純粹是GWT UiBinder的行爲，你可以GWTP瞭解here

具體而言，教科書的解決方案是：

在TestView.java補充：

public TestView extends SomeGWTPViewClass implements TestPresenter.MyView 
{ 
    public interface MyStyle extends CssResource 
    { 
     String myBut(); 
    } 

    @UiField MyStyle style; 


    @Override 
    MyStyle getStyle() 
    { 
     return style; 
    } 

    //rest of code here...... 
    ..... 
    ... 


}

在TestView.ui.xml中將ui：style更改爲：

<ui:style src='myStyle.css' type="fully.qualified.package.name.TestView.MyStyle"/>
在TestPresenter.MyView界面添加
：

getView().getMyBut2().addStyleName(getView().getStyle().myBut());

來源

2013-07-15 21:24:03

@MinhHai，感謝：

MyStyle getStyle();

現在你可以通過訪問myBut風格TestPresenter爲了指出這一點，我確定了答案（一些形式化問題導致了這一點不可見） –

如何在GWTP中正確使用CSS？

回答

相關問題