0

好的，要为 Gwt 或 Gwtp 中的小部件设置 Css，我们可以执行以下操作：

-1。直接来自gwt代码。例如：label1.getElement().getStyle().setBackground("blue");
-2。在 UiBinder xml 文件中包含“ui:style”，但此 css 仅对该 UiBinder 可见
-3。在 UiBinder xml 文件中包含“ui:width”，它将对所有 UiBinder 可见
 - 并且有很多方法可以将 Css 直接设置为 UiBinder 中的小部件。

让我感到困惑的是，如果我使用，前

<ui:with field='res' type="com.myproj.client.MyResource" />

& 如果myResource.css有，.gwt-TabLayoutPanel那么我不需要使用“addStyleNames”，例如<g:TabLayputPanel />，它可以完美地识别 CSS。

但是，如果我添加.gwt-ScrollPanel并myResource.css使用<g: ScrollPanel />，那么什么也没有发生。

所以我必须创建public interface MyCssResource extends CssResource，然后添加String gwt-ScrollPanel();到MyCssResource. 但是 Java eclipse 不允许-方法名中有连字符，所以我必须改为String gwtScrollPanel();.

最后，我必须添加addStyleNames到<g: ScrollPanel />, ex<g: ScrollPanel addStyleNames="{res.css.gwtScrollPanel}" />然后它才能工作。

这也意味着如果我想使用.gwt-TabLayoutPanelin MyCssResource，那么我需要删除连字符-，这将导致我的代码不一致。

那么，有人可以向我解释这里发生了什么吗？我很困惑？

4

2 回答 2

2

您应该注意的唯一想法是，当您在 ui-binder 中使用 then 时，GWT 会混淆类名。例如：

 <ui:style>
   .gwtTabLayoutPanel {}
 </ui:style>
 <g:TabLayoutPanel addStyleNames="{style.gwtTabLayoutPanel}" />

.gwtTabLayoutPanel将被重命名为.AB最终注入的样式表中的内容。

但是大多数 GWT 小部件都使用未混淆的类名进行样式设置，因此为了在 ui-binders 文件中使用它们，您必须将它们定义为外部以防止 GWT 编译器混淆类名：

 <ui:style>
   @external .gwt-TabLayoutPanel;
   .gwt-TabLayoutPanel {}
 </ui:style>
 <g:TabLayoutPanel />
于 2013-10-01T07:58:28.610 回答
1

这是因为当您创建 TabLayoutPanel 时，它有一个名为 .gwt-TabLayoutPanel 的默认类。因此，您无需手动将该类添加到您的 TabLayoutPanel 中。只需创建一个 TabLayoutPanel，您就会看到“.gwt-TabLayoutPanel”类已经存在。

在此处输入图像描述

但是 ScrollPanel 不附带名为 .gwt-ScrollPanel 的默认类。它只是一个div。尝试创建一个 ScrollPanel 并查看。它最初没有添加任何类。见截图

在此处输入图像描述

如果要添加一个名为 .gwt-ScrollPanel 的类，则必须手动进行。

于 2013-10-01T07:46:24.237 回答