GWT - 設置全局CSS樣式的最佳方法

Question

我們使用GXT和GWT，每個基礎構件都有一個CSS文件。 GWT有一個全球CSS風格的最佳方式是什麼？

例如

global.css 

.backgroundBorder { 
    border-style: solid; 
    border-width: 2px; 
    border-radius: 3px; 
} 

myWidget.css

@backgroundBorder 

Answer 1

我同意。另外我會在上面的AppClientBundle中包含一個接口。

public interface AppClientBundle extends ClientBundle { 

    public static final AppClientBundle INSTANCE = GWT.create(AppClientBundle.class); 

    @Source({ "css/template/global.css" }) 
    MyStyle css(); 
    public interface MyStyle extends CssResource { 
    String backgroundBorder(); 
    } 
} 

這給你的風格你的widget這樣的可能性：

Widget.setStylePrimaryName(AppClientBundle.INSTANCE.css().backgroundBorder()); 

希望幫助...

Answer 2

您可以使用ClientBundles和CssResources。

https://developers.google.com/web-toolkit/doc/latest/DevGuideClientBundle#CssResource

在您的入口點可以設置全局CSS。 類似的是：

YourStyle.getTheme().getAppClientBundle().getGlobalCss().ensureInjected(); 

你clientbundle也能像類似：

public interface AppClientBundle extends ClientBundle { 

    @Source({ "css/template/global.css" }) 
    CssResource getGlobalCss(); 

} 

從我的experiance，這是最好的方式。