0

I'm new to GWT. I just started doing a simple GWT forum as a project to my University. I have problem with getting UiBinder working. I think showing code is the best way to explain my issue.

Header.ui.xml

<g:DockLayoutPanel>
    <g:west size="5">
        <g:Label ui:field="forumTitle"/>
    </g:west>
</g:DockLayoutPanel>

Header.java

package com.project.gwtforum.client.widgets;

import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.uibinder.client.UiField;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.Widget;

public class Header extends Composite{

    private static HeaderUiBinder uiBinder = GWT.create(HeaderUiBinder.class);

    interface HeaderUiBinder extends UiBinder<Widget, Header> {
    }

    public Header() {
        initWidget(uiBinder.createAndBindUi(this));
    }

    @UiField
    Label forumTitle;

    public Label getForumTitle() {
        return forumTitle;
    }
}

GWTForum.html

<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <link type="text/css" rel="stylesheet" href="GWTForum.css">

    <script type="text/javascript" language="javascript" src="gwtforum/gwtforum.nocache.js"></script>

  </head>

  <body>

    <div id="header"></div>

    <iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>

  </body>
</html>

GWTForum.css

h1 {
  font-size: 2em;
  font-weight: bold;
  color: #777777;
  margin: 40px 0px 70px;
  text-align: left;
}

GWTForum.java

package com.project.gwtforum.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.RootPanel;
import com.project.gwtforum.client.widgets.Header;

public class GWTForum implements EntryPoint{

    private GWTForumConstants constants = GWT.create(GWTForumConstants.class);
    private Header headerWidget = new Header();

    @Override
    public void onModuleLoad() {
        initializeLayout();
    }

    private void initializeLayout() {
        RootPanel.get("header").add(headerWidget);
        Window.setTitle(constants.windowTitle());

        headerWidget.getForumTitle().setText(constants.windowTitle());
        headerWidget.getForumTitle().setStyleName("h1");
    }

}

The problem is there's nothing in the browser when i compile a project.. When i debug the application i can see that RootPanel is changing - the code in it was right but the browser show nothing. Firebug also see "header" div with Label etc. but nothing is shown. Firefox's "Show source code" have nothing in the "header" div. What I'm doing wrong?

4

1 回答 1

1

您正在混合布局 ( DockLayoutPanel) 和非布局 ( RootPanel.get("header")) 面板。

要么使用RootLayoutPanel（这将钩住你的应用程序的整个主体；因此你需要重写它来设置应用程序内的页眉/主/页脚区域，而不是依赖DOM占位符）或header显式设置大小。请参阅官方文档。

我会选择前者。

于 2013-11-30T11:31:38.383 回答