4

我想使用 UiBinder 制作一个 GWT 小部件。所以我做了：

UserPanel.ui.xml 像这样：

<?xml version="1.0" encoding="UTF-8"?>
<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.example.resources.UserPanelResources"  />

    <g:VerticalPanel styleNames='{res.userpanel.main}'>
      ...some other widgets go here...
    </g:VerticalPanel>
</ui:UiBinder>

UserPanel.css 像这样：

.main {
    width: 1000px;
    background-color: #f9f9fa;
    padding: 15px 10px;
    font-family: "Georgia";
}

和 UserPanelResources.java 像：

public interface UserPanelResources extends ClientBundle {
    public interface UserPanelCss extends CssResource {
        String main();
    }

    @Source("css/userpanel.css")
    UserPanelCss userpanel();
}

所有文件和包都在它们的位置，因为一切都编译得很好。但是当我运行开发模式时，没有应用样式！我尝试了许多不同的方法，但它仍然不起作用。

我注意到的是，在 HTML 中，VerticalPanel 被赋予了被 GWT 混淆的类名，但 CSS 没有发送到浏览器——事实上，GWT 甚至不要求它。

我错过了什么吗？

4

2 回答 2

7

好的，我找到了解决方案。

原来是没有注入的UserPanelCss。

解决方案在 UserPanelResources,java 中：

public interface UserPanelResources extends ClientBundle {
    public final static UserPanelResources INSTANCE = GWT.create(UserPanelResources.class)

    public interface UserPanelCss extends CssResource {
        String main();
    }

    @Source("css/userpanel.css")
    UserPanelCss userpanel();
}

在 UserPanel.java 类中添加：

static {
    UserPanelResources.INSTANCE.userpanel().ensureInjected();  
}
于 2010-03-12T12:26:54.267 回答
3

对于仅在 UiBinder 文件中使用的 CSS 资源，我遇到了同样的问题。

我在我的小部件构造函数中添加了一个 hack 来修复它。这是使用上述类名的等价物：

  @注入
  用户面板（用户面板资源资源）{
    resources.userpanel().ensureInjected();
    initWidget(BINDER.createAndBindUi(this));
    ...
  }
于 2011-01-07T19:52:14.793 回答