GWT CSSResource

Question

CSSResource接口

public interface AppResources extends ClientBundle { 
    public static final AppResources INSTANCE = GWT.create(AppResources.class); 

    interface Style extends CssResource { 
     String login(); 
    } 

    @Source("css/style.gss") 
    Style style(); 

    @Source("images/logo.png") 
    ImageResource logo(); 
} 

样式

.login { 
    width: 100%; 
    height: 100%; 
} 

.login .panel-body { 
    text-align: center; 
} 

.login .loginWrapper { 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    width: 100%; 
    height: 100%; 
} 

.login .input-group { 
    padding-bottom: 10px; 
    width: 300px; 
} 

.login .input-group-addon { 
    width: 100px; 
} 

当你尝试编译 我有错误

[错误]以下非混淆类是存在于严格的CssResource：panel-body。通过将String访问器方法添加到混淆类的CssResource接口来修复，或对未混淆的类使用@external声明。

[错误]以下非混淆类出现在严格的CssResource：input-group-addon中。通过将String访问器方法添加到混淆类的CssResource接口来修复，或对未混淆的类使用@external声明。

[错误]以下非混淆类存在于严格的CssResource：input-group中。通过将String访问器方法添加到混淆类的CssResource接口来修复，或对未混淆的类使用@external声明。

是，这个问题可以通过在界面风格将这些风格 但我想知道是否有可能应用一种管教方式登录来解决，而孩子会自动上升???

Answer 1

如果你只是想摆脱编译错误的，只是所有的类添加@external线在你的CSS，像这样：

@external panel-body, loginWrapper, input-group, input-group-addon; 

这样，你告诉GWT：“忽略此上课，我会照顾他们“。见the relevant doc。

但是！
一个使用CSSResource的点是这样，你可以这样做：

myWidget.addClassName(AppResources.INSTANCE.style().panelBody()); 
myWidget.removeClassName(AppResources.INSTANCE.style().loginWrapper()); 

取而代之的是：

myWidget.addClassName("panel-body"); 
myWidget.removeClassName("loginWrapper"); 

第二个版本是更容易出错，因为你写的类名只有在你启动应用程序之前，你才会知道你是否做得正确（除非你的IDE检查了CSS类的名字并事先发出警告）。

使用CSSResource您可以理想地定义一个带有所有必要方法的样式界面，在您的Java代码中使用它们，让其他人（设计师）负责支持实际的CSS文件和属性。
而且，由于现在您的Java代码只关心接口方法，因此GWT可以使用您的CSS并对其进行清理，缩小并对其进行混淆处理，以便在编译和运行时更好地管理它。

这些特权的价格不得不为每个想要GWT管理的CSS类定义一个方法。如果你只有一堆类，你最好为它们添加方法。