RootPanel vs RootLayoutPanel

1,786 views
Skip to first unread message

John

unread,
Jun 4, 2010, 2:13:31 PM6/4/10
to Google Web Toolkit
I'm new to GWT and trying to put together a simple login screen that
displays an alert window when the user presses the Login button. The
layout is done using UIBinder in a g:DockLayoutPanel. Which means
that my LoginWindow class has to be added to the RootLayoutPanel in
the onModuleLoad() function of my EntryPoint class:

public void onModuleLoad() {
DockLayoutPanel root = uiBinder.createAndBindUi(this);
RootLayoutPanel.get().add(root);
}

However, none of the @UIHandler functions get triggered. If I instead
add the LoginWindow to the RootPanel, nothing gets shown, but from
what I've read events should then work:

DockLayoutPanel root = uiBinder.createAndBindUi(this);
DockLayoutPanel root = uiBinder.createAndBindUi(this);
RootPanel.get().add(root);
}

Now, I may be missing something very simple, but I haven't been able
to find anything online that describes how to fix this problem. My
question basically boils down to, how do you enable event triggering
of UIBinder layouts with nothing in the RootPanel?

Thanks!
John

Stefan U.

unread,
Jun 6, 2010, 6:48:59 PM6/6/10
to Google Web Toolkit
Hi John,

On 4 Jun., 20:13, John <bradley.r...@gmail.com> wrote:
> I'm new to GWT and trying to put together a simple login screen that
> displays an alert window when the user presses the Login button.  The
> layout is done using UIBinder in a g:DockLayoutPanel.  Which means
> that my LoginWindow class

Just to make sure we are on the same page: I assume that this
(LoginWindow) is a widget that you define using UIBinder.

> has to be added to the RootLayoutPanel in
> the onModuleLoad() function of my EntryPoint class:
>
> public void onModuleLoad() {
>                 DockLayoutPanel root = uiBinder.createAndBindUi(this);
>                 RootLayoutPanel.get().add(root);
>         }
>

Now that part is confusing. Here I would expect something like

public void onModuleLoad() {
                LoginWindow loginWindow = new LoginWindow();
                RootLayoutPanel.get().add(loginWindow);
        }

Maybe you should have another look at the uibinder tutorial. BTW, do
not try to use RootPanel with uibinder. Uibinder will only work when
using RootLayoutPanel.

God luck!
Stefan

googelybear

unread,
Jun 6, 2010, 7:55:18 PM6/6/10
to Google Web Toolkit
RootLayoutPanel is designed for the new "full screen" Layout panels
(GWT 2.0 and newer). RootPanel for the "regular" panels.
Use RootLayoutPanel when you have at least 1 layout panel in your app.

@Stefan: Can you explain what's wrong with using uibinder and
RootPanel as long as you do NOT have any layout panels (this is what I
am doing currently and so far it seems to work fine) ?

thanks,
Dennis

Stefan U.

unread,
Jun 7, 2010, 1:23:17 AM6/7/10
to Google Web Toolkit
@Dennis, thanks for correcting me. I had this confused because I
started using the new GWT 2.0 layout system the same time I started
using UiBinder. So, to repeat this once more: the issue of
RootLayoutPanel vs. RootPanel has nothing to do with UiBinder. If you
are not using any of the LayoutPanels, you should use RootPanel.

(However, this seems to be a reasonable suggestion, does it not: if
you are starting a new project, try using the new GWT 2.0 layout
system, i.e. Move to standards mode and use the new Layout-based
panels. See http://code.google.com/intl/de-DE/webtoolkit/doc/latest/DevGuideUiPanels.html#Standards
Do you agree?)

Best regards,
Stefan

googelybear

unread,
Jun 7, 2010, 4:15:43 AM6/7/10
to Google Web Toolkit
@Stefan: That's what I thought too, and the javadoc and the dev pages
make you believe that (Use LayoutPanels, they are new, shiny, better).
But the layout panels are drastically different from the normal
panels. If you want to have a "traditional" website behavior where the
browser displays scrollbars as soon as the content gets too big (e.g.
gmail) do NOT use LayoutPanels. If you want a more "application like"
look, where the app fills the entire client-area of the browser and
displays scrollbars itself (which means every gwt container by itself)
use the new panels. A popular example for this is google wave. That's
probably what those panels have been created for. So choose wisely ;-)

You can read more about this here:
http://groups.google.com/group/google-web-toolkit/browse_thread/thread/5f68621da14f034d

Another thing to keep in mind: Stuffing a layout panel in a normal
panel is generally a bad idea.

On Jun 7, 7:23 am, "Stefan U." <stefan.uk...@gmail.com> wrote:
> @Dennis, thanks for correcting me. I had this confused because I
> started using the new GWT 2.0 layout system the same time I started
> using UiBinder. So, to repeat this once more: the issue of
> RootLayoutPanel vs. RootPanel has nothing to do with UiBinder. If you
> are not using any of the LayoutPanels, you should use RootPanel.
>
> (However, this seems to be a reasonable suggestion, does it not: if
> you are starting a new project, try using the new GWT 2.0 layout
> system, i.e. Move to standards mode and use the new Layout-based
> panels. See  http://code.google.com/intl/de-DE/webtoolkit/doc/latest/DevGuideUiPan...

John

unread,
Jun 7, 2010, 12:05:10 PM6/7/10
to Google Web Toolkit
Thanks you guys for replying. I guess I was a bit unclear in where my
confusion was. I understand the difference between RootPanel and
RootLayoutPanel. However, I had a basic login screen and no click
events were being triggered because somehow by adding my login window
to the RootLayoutPanel, an extra invisible <div> was thrown on top of
everything. When added to the RootPanel (even though you're not
supposed to) the div was not there and the click event registered
(though the formatting was gone).

I went with the more straightforward instantiation of the login window
you suggested Stefan and the problem went away.

John

On Jun 7, 4:15 am, googelybear <googelyb...@gmail.com> wrote:
> @Stefan: That's what I thought too, and the javadoc and the dev pages
> make you believe that (Use LayoutPanels, they are new, shiny, better).
> But the layout panels are drastically different from the normal
> panels. If you want to have a "traditional" website behavior where the
> browser displays scrollbars as soon as the content gets too big (e.g.
> gmail) do NOT use LayoutPanels. If you want a more "application like"
> look, where the app fills the entire client-area of the browser and
> displays scrollbars itself (which means every gwt container by itself)
> use the new panels. A popular example for this is google wave. That's
> probably what those panels have been created for. So choose wisely ;-)
>
> You can read more about this here:http://groups.google.com/group/google-web-toolkit/browse_thread/threa...

Troy Borja

unread,
Aug 25, 2011, 6:26:39 AM8/25/11
to google-we...@googlegroups.com
Hello,

We use Window Builder to design the View using GWT Widgets and use FlowPanel, LayoutPanel. This way we get absolute positioning when designing using Window Builder. 

We then insert the View into the RootPanel instead of RootLayoutPanel so that the browser scrollbar will appear when the inner panels are larger than the browser window.

You get the best of both worlds. Absolute positioning during page design and scrolling pages when running the app.
Reply all
Reply to author
Forward
0 new messages