GWT StackPanel造型

Question

我想这应该是直截了当的，除了我无法理解。我正在尝试使用stackpanel。我正在尝试设置样式，以便标题的文本，背景颜色等与我的应用程序的其余部分匹配。

我正在使用css和客户端包将样式应用于我的组件。

我尝试使用两种方法设置堆栈面板的样式，但都失败了。

方法一：

如果我将以下内容应用于MyProject.html样式部分：

.gwt-StackPanel .gwt-StackPanelItem {
    font-weight: normal;
    font-size: 8pt;
    width: 100%;
    background: green;
}


.gwt-StackPanel .gwt-StackPanelItem-selected {
    background-color: red;
}

然后在Firefox中加载它，我仍然看到默认样式。如果我打开firebug并检查元素，我会看到gwt默认样式仍在应用。

方法2：

如果我将上述样式封装在我的css文件中，那么GWT编译器会抱怨混淆样式？所以我将@external attrib添加到样式中，编译器没有抱怨，但我仍然没有看到我的更改应用。

提前致谢！

Answer 1

我知道这是一个迟到的答案，但如果有人来这里，我有一个建议。你的CSS被gwt主题覆盖的原因是gwt主题在你的模块文件（.gwt.xml）中是预先设定的。更改此方法的方法是在gwt主题之后将您自己的CSS文件包含在模块文件中。

例如，您应该在模块文件中看到类似的内容：

<!-- You can change the theme of your GWT application by -->
<!-- uncommenting any one of the following lines. -->
<!-- <inherits name='com.google.gwt.user.theme.standard.Standard'/> -->
<!-- <inherits name='com.google.gwt.user.theme.chrome.Chrome'/> -->
<!-- <inherits name='com.google.gwt.user.theme.dark.Dark'/> -->
<inherits name='com.google.gwt.user.theme.clean.Clean' />

在此之后的某个地方，为您自己的css文件添加样式表语句：

<!-- CSS Style Sheet includes -->
<stylesheet src="<pathToYourCSSFile>.css" />

现在，因为您的文件包含在gwt样式之后，您的样式将优先于gwt！

Answer 2

我总是从模块的xml文件中注释掉这一行：

<inherits name='com.google.gwt.user.theme.standard.Standard'/>

然后您可以使用自己的样式将样式名添加到窗口小部件（stackPanel.setStyle ...） 如果你需要一个默认的gwt样式，你可以将它从gwt-user.jar com.google.gwt.user.theme.standard.Standard.public.gwt.standard.standard.css复制到你自己的css文件中。