1

我有基于 GWTP 的 gwt 应用程序。应用程序支持两个版本（平板电脑和桌面）并使用不同的小部件库（sencha gxt 和 sencha touch）。这些库在主机页面中需要不同的 css 文件。Moreother css相互冲突。如何在我的主机页面中加载不同的 css 文件？

我已经阅读了gwt mobilewebapp sample，但它们使用单​​个 html 页面和不同的组件实现。

4

3 回答 3

2

您可以检查 Useragent 并决定要交付的 CSS 文件。

我建议使用ClientBundles。这仅提供所需的 css 样式，并加快您的页面速度。

在您的入口点中，您只需决定要交付哪个 css 文件：

if(useragent == "desktop") {
   YourStyle.getTheme().getMGWTClientBundle().getDesktopCss().ensureInjected();
} else {
   YourStyle.getTheme().getMGWTClientBundle().getAppCss().ensureInjected();
}

或者您可以在您的 css 文件中进行切换。但是无论如何您都必须使用 ClientBundles。

在那里你可以有这样的东西：

@external gwt-button;
@if user.agent safari {
    .gwt-Button {
        ...
    }
}

@external gwt-button 是为了避免混淆错误。你也可以使用@external *;

于 2012-12-21T17:07:19.967 回答
1

您也可以在服务器端执行此操作，方法是使用 JSP 文件作为 css 源。然后，在 JSP 文件中，根据请求的用户代理或其他决定发送哪一组属性。

另一种选择是将主机页面编写为 JSP 文件，它可以根据请求包含适当的 CSS 文件。
这是一种非常简单的方法，但是您必须在 web.xml 中启用 JSP 处理器。它还要求您部署的系统上有一个 java 编译器，如果您只在 Web 服务器上安装 JRE，则情况并非如此。

于 2012-12-21T17:25:43.147 回答
0

您必须创建两个加载 css 文件的类：

您可以做一些与输入 gwt.xml 文件相关的事情

<replace-with
    class="com.test.classMobile">
    <when-type-is
        class="com.Test.classBrowser" />
    <when-property-is name="tablet.user.agent" value="ipad" />
</replace-with>

试试这个..我不确定 100%

于 2012-12-25T12:54:18.333 回答