在<ui:style>文件中使用class或在css文件中写HTML以GWT Widgets个文件中的GWT ui.xml元素（<ui:style>}更优选。我知道如果要使用class，那么<ui:style>属性的名称非常难。请帮助我找出何时使用<ui:style>
.panel {
width: 100%;
}
.decPanel {
height:100%;
}
</ui:style>
<g:HTMLPanel addStyleNames='{style.panel}'>
<fieldset addStyleNames='{style.decPanel}'>
<legend>
...
</legend>
</fieldset>
</g:HTMLPanel>
class以及何时使用 .panel {
width: 100%;
}
.decPanel {
height:100%;
}
CSS 文件
<g:HTMLPanel class="panel">
<fieldset class="decPanel">
<legend>
...
</legend>
</fieldset>
</g:HTMLPanel>
ui.xml 文件
{{1}}
答案 0 :(得分：3)
它可能有助于您理解使用<ui:style>而不是常量静态类名称的优势。
使用<ui:style>元素，您可以根据需要为您的用户界面定义CSS。
样品：
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'>
<ui:style>
.pretty { background-color: Skyblue; }
</ui:style>
<div class='{style.pretty}'>
Hello, <span ui:field='nameSpan'/>.
</div>
</ui:UiBinder>
为您生成CssResource界面以及ClientBundle。这意味着当您尝试使用拼错类名时，编译器会发出警告（例如{style.prettty}）。
此外，您的CSS类名称将模糊，从而保护它免受其他CSS块中与类名称冲突的冲突 - 无需更多全局CSS命名空间！
注意：大多数真实世界的项目可能会将CSS保存在单独的文件中。在下面给出的示例中，src值是相对于ui.xml文件的位置。
样品
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'>
<ui:style src="MyUi.css" />
<ui:style field='otherStyle' src="MyUiOtherStyle.css">
<div class='{style.pretty}'>
Hello, <span class='{otherStyle.pretty}' ui:field='nameSpan'/>.
</div>
</ui:UiBinder>
首选<span class='{otherStyle.pretty}'代替<span class='pretty'。
======================
修改
根据@Thomas在评论中提出的建议，请使用<ui:with>
有时，您的模板需要使用来自模板外部的样式或其他对象。使用<ui:with>元素使其可用。
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
xmlns:g='urn:import:com.google.gwt.user.client.ui'>
<ui:with field='res' type='com.my.app.widgets.logoname.Resources'/>
<g:HTMLPanel>
<g:Image resource='{res.logo}'/>
<div class='{res.style.mainBlock}'>
<div class='{res.style.userPictureSprite}'/>
<div>
Well hello there
<span class='{res.style.nameSpan}' ui:field='nameSpan'/>
</div>
</div>
</g:HTMLPanel>
</ui:UiBinder>
/**
* Resources used by the entire application.
*/
public interface Resources extends ClientBundle {
@Source("Style.css")
Style style();
@Source("Logo.jpg")
ImageResource logo();
public interface Style extends CssResource {
String mainBlock();
String nameSpan();
Sprite userPictureSprite();
}
}
// Within the owner class for the UiBinder template
@UiField Resources res;
...
res.style().ensureInjected();