PDA

View Full Version : [FIXED] Beta 1 - ToolBar with status at bottom of Window invisible until resized? Why?



jvahabzadeh
10 Jan 2012, 1:01 PM
I have created a Window whose Widget is a NorthSouthContainer.

The NorthWidget is a ToolBar with two buttons added to it.

The SouthWidget is a ToolBar with a Status added to it.

However, when I show() the Window, the north ToolBar is visible, but the south ToolBar with the Status is not, unless I manually resize the window by dragging an edge or corner.

Any idea why?

Here's the code to reproduce the issue:


public class WindowStatusBarIssue implements EntryPoint {

public void onModuleLoad() {
Window w = new Window();
NorthSouthContainer container = new NorthSouthContainer();
ToolBar toolBar = new ToolBar();
toolBar.add(new TextButton("Button-1"));
toolBar.add(new TextButton("Button-2"));
ToolBar statusBar = new ToolBar();
Status status = new Status();
status.setText("Ready...");
statusBar.add(status);
VerticalLayoutContainer layoutContainer = new VerticalLayoutContainer();
layoutContainer.add(new Label("some info"));
layoutContainer.add(new Label("more stuff"));
container.setWidget(layoutContainer);
container.setNorthWidget(toolBar);
container.setSouthWidget(statusBar);
w.add(container);
w.setWidth(400);
w.setHeight(250);
layoutContainer.forceLayout(); // can you tell
container.forceLayout(); // that I was starting
w.forceLayout(); // to get desperate here?
w.show();
}
}

johnz45
11 Jan 2012, 7:42 PM
have you tried setting the layoutData of the toolbars to divide the height between the two toolbars?

jvahabzadeh
12 Jan 2012, 6:14 AM
I haven't tried that . . basically my Window will show (once I've done a manual resize) the ToolBar with Buttons on top, and the ToolBar with Status on bottom, with a relatively large open area in the middle.

I was hoping not to have to explicitly size them - I would guess that it shouldn't be necessary because, once a resize is done, it seems to know what to do.

However, I'm actually a little unclear on what you mean:

have you tried setting the layoutData of the toolbars to divide the height between the two toolbars?

Um, can you clarify what you mean/intend by that?

johnz45
12 Jan 2012, 11:46 AM
For your purpose, have you tried using a VerticalLayoutContainer? It seems your spacing issue is because your NorthSouthContainer is resizing to the parent size. If I want to guarantee 50/50 split sizing for 2 widgets, I use:



mainVert.add(graphPanel, new VerticalLayoutData(1,0.5));
mainVert.add(actionPanel, new VerticalLayoutData(1,0.5));

jvahabzadeh
12 Jan 2012, 1:48 PM
Ah, but I don't want a 50/50 split, I'm looking specifically for basically what amounts to a BorderLayout with only North, South, and Center components.

The baffling thing is that, once I manually resize (and it can be literally resizing it only a single pixel larger by dragging the corner with the mouse), it looks EXACTLY how I want it, but before I do that, the South part is invisible.

robferguson
21 Jan 2012, 5:11 PM
Hi,

Have you tried calling forceLayout() ?

Cheers
Rob

jvahabzadeh
24 Jan 2012, 5:28 AM
Yep . . 3 of the last 4 lines in my code above are calls to forceLayout on various components.

No luck with that.

robferguson
24 Jan 2012, 1:18 PM
Hi,

I have also found that you sometimes need to perform an initial size/re-size on widgets added to a layout container. For example:



public abstract class AbstractPagingView<C extends UiHandlers> extends ViewWithUiHandlers<C> {

public static final String CONTEXT_AREA_WIDTH = "100%";
public static final String CONTEXT_AREA_HEIGHT = "100%";
public static final String TOOLBAR_HEIGHT = "26px";

protected VerticalLayoutContainer panel;

protected final ToolBar toolBar;
protected final Grid<?> grid;

@Inject
public AbstractPagingView(ToolBar toolBar, final Grid<?> grid) {
super();

this.toolBar = toolBar;
this.grid = grid;

this.panel = new VerticalLayoutContainer();
this.panel.setSize(CONTEXT_AREA_WIDTH, CONTEXT_AREA_HEIGHT);
this.toolBar.setSize(CONTEXT_AREA_WIDTH, TOOLBAR_HEIGHT);
this.grid.setSize(CONTEXT_AREA_WIDTH, TOOLBAR_HEIGHT);

this.panel.add(this.toolBar, new VerticalLayoutData(1, -1));
this.panel.add(this.grid, new VerticalLayoutData(1, 1));

Scheduler.get().scheduleDeferred(new Scheduler.ScheduledCommand() {
public void execute() {
resize();
}
});

bindCustomUiHandlers();
}

public void resize() {

int width = Window.getClientWidth();
int height = Window.getClientHeight();

Log.debug("resize() - width: " + width + " height: " + height);

panel.setSize(width + "px", height + "px");
panel.onResize();
}


Also, take a look at the layout code for ResizeContainer.

Cheers
Rob

robferguson
24 Jan 2012, 1:36 PM
Hi,

The sample Ext GWT demo:

http://gwt-cx.com/extgwt-serendipity/Serendipity.html

You can browse the code:

http://code.google.com/p/gwt-cx/source/browse/

Cheers
Rob

http://code.google.com/p/gwt-cx/

darrellmeyer
3 Feb 2012, 9:51 AM
This is now fixed in SVN. Change will go out in the next release. As a workaround, you can use VerticalLayoutContainer rather than NorthSouthContainer. Use VerticalLayoutData values of 1, -1 for the top and bottom components, and value of 1,1 for the center widget.

WesleyMoy
28 Mar 2012, 2:54 PM
This bug has been fixed in the Ext GWT 3.0 Release Candidate. Please upgrade your copy of Ext GWT and try your test case again. While we're confident that we've addressed this issue, please reply if you notice any continued problems after upgrading. Again, thanks for taking the time to report this bug.