为什么在GWT或GWTP中有这么多方法来设置小部件的CSS,我感到困惑?有人能澄清一下吗?

为什么在GWT或GWTP中有这么多方法来设置小部件的CSS,我感到困惑?有人能澄清一下吗?,gwt,uibinder,gwtp,cssresource,Gwt,Uibinder,Gwtp,Cssresource,好的,要在Gwt或Gwtp中为小部件设置Css,我们可以执行以下操作: -1. directly from gwt code. Ex: label1.getElement().getStyle().setBackground("blue"); -2. include "ui:style" in UiBinder xml file, but this css only visible to that UiBinder -3. include "ui:width" in UiBinder xml f

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

-1. directly from gwt code. Ex: label1.getElement().getStyle().setBackground("blue"); -2. include "ui:style" in UiBinder xml file, but this css only visible to that UiBinder -3. include "ui:width" in UiBinder xml file, it will visible to all UiBinder - and there r many way to set the Css directly to the widget in UiBinder. -1.直接来自gwt代码。例如:label1.getElement().getStyle().setBackground(“蓝色”); -2.在UiBinder xml文件中包含“ui:style”,但此css仅对该UiBinder可见 -3.将“ui:width”包含在UiBinder xml文件中,它将对所有UiBinder可见 -还有很多方法可以直接将Css设置到UiBinder中的小部件。 让我困惑的是,如果我使用

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

&如果
myResource.css
.gwtableoutpanel
,那么我不需要使用“addStyleNames”,例如
,它可以完全识别css

但是,如果我将
.gwt ScrollPanel
添加到
myResource.css
&use
中,那么什么也没有发生

因此,我必须创建
公共接口MyCssResource扩展CssResource
,然后添加
字符串gwt-ScrollPanel()
MyCssResource
。但是Java eclipse不允许在方法名中使用连字符
-
,因此我必须更改为
String gwtScrollPanel()

最后,我必须将
addStyleNames
添加到
,例如
,然后它就可以工作了

这也意味着如果我想在
MyCssResource
中使用
.gwtableayoutpanel
,那么我需要删除连字符
-
&这将导致我的代码不一致


有人能给我解释一下这是怎么回事吗?我很困惑?

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

但是ScrollPanel没有一个名为.gwt ScrollPanel的默认类。它只是一个div。请尝试创建一个滚动面板,然后查看。最初没有添加任何类。请参见屏幕截图


如果要添加名为.gwt ScrollPanel的类,则必须手动添加。

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

但是ScrollPanel没有一个名为.gwt ScrollPanel的默认类。它只是一个div。请尝试创建一个滚动面板,然后查看。最初没有添加任何类。请参见屏幕截图


如果要添加名为.gwt ScrollPanel的类,则必须手动添加。

您应该注意的唯一一点是,当您在ui绑定中使用时,gwt会混淆类名。例如:

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

您唯一应该注意的是,当您在ui绑定中使用时,GWT会混淆类名。例如:

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

谢谢你的指导。我现在清楚了。但为什么谷歌不把“.gwtablayoutpanel”作为默认值呢?这样我就可以在MyCssResource.java中使用它了?相反,他们使用“.gwt TabLayoutPanel”&那么我不能在MyCssResource.java中的hyphen.Thax u的cos中使用“.gwt TabLayoutPanel”作为您的指令。我现在清楚了。但为什么谷歌不把“.gwtablayoutpanel”作为默认值呢?这样我就可以在MyCssResource.java中使用它了?相反,他们使用了“.gwt tablayompanel”&那么我就不能在MyCssResource.java中使用连字符的cos中使用“.gwt tablayompanel”。