PDA

View Full Version : empty Window , why?



dbettoni
15 May 2008, 7:37 AM
why does this code show a empty window?



package it.dbj.gxt.client;

import com.extjs.gxt.ui.client.widget.Container;
import com.extjs.gxt.ui.client.widget.Window;
import com.extjs.gxt.ui.client.widget.layout.CenterLayout;
import com.extjs.gxt.ui.client.widget.layout.TableLayout;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.VerticalPanel;

public class TableCenteredLayoutTest implements EntryPoint {


public void onModuleLoad() {
Window w = new MyWindow();
RootPanel.get().add(w);
w.show();
}
static class MyWindow extends Window {

public MyWindow() {

setHeading("MyWindow");
setClosable(true);
setModal(true);
setResizable(true);

Container c= new Container();
TableLayout tablelayout = new TableLayout(3);
tablelayout.border=1;
c.setLayout(tablelayout);

VerticalPanel vpl = new VerticalPanel();
vpl.add(new Label("L"));
c.add(vpl);

VerticalPanel vp = new VerticalPanel();
vp.setSpacing(3);
for (int i = 0; i < 5; i++) {
vp.add( new Label("MyLabel-"+i));
}
c.add(vp);

VerticalPanel vpr = new VerticalPanel();
vpr.add(new Label("R"));
c.add(vpr);

setLayout(new CenterLayout());
add(c);
}
}
}
a similar code with MyGWT shows the attached image

darrellmeyer
15 May 2008, 8:02 AM
Set the TableLayout width to 100%. Also, you do not add the Window to the RootPanel, just call show().

dbettoni
15 May 2008, 8:52 AM
if you mean:
remove line: RootPanel.get().add(w);
add line: tablelayout.width="100%";

I've tried to do it but the result doesn't change.
the code show the attached image

darrellmeyer
15 May 2008, 9:26 AM
You need to use TableData to control the TD for each component you add to the container.



TableData data = new TableData();
data.width = "100%";
c.add(vpl, data);

dbettoni
16 May 2008, 9:14 AM
ok, now this code runs, but ...
why isn't the table centered?
(see attached image)
:-? the line

add(c, new CenterLayout ()); has the same effect as

add(c);test code


package it.dbj.gxt.client;

import com.extjs.gxt.ui.client.widget.Container;
import com.extjs.gxt.ui.client.widget.Window;
import com.extjs.gxt.ui.client.widget.layout.CenterLayout;
import com.extjs.gxt.ui.client.widget.layout.TableData;
import com.extjs.gxt.ui.client.widget.layout.TableLayout;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.VerticalPanel;

/**
* see: http://extjs.com/forum/showthread.php?p=168651
*/
public class TableCenteredLayoutTest implements EntryPoint {


public void onModuleLoad() {
new MyWindow().show();
}
static class MyWindow extends Window {

public MyWindow() {

setHeading("MyWindow");
setClosable(true);
setModal(true);
setResizable(true);

Container c= new Container();
TableLayout tablelayout = new TableLayout(3);
tablelayout.border=1;
c.setLayout(tablelayout);

VerticalPanel vpl = new VerticalPanel();
vpl.add(new Label("L"));
TableData data = new TableData();
data.width = "15%";
c.add(vpl,data);

VerticalPanel vp = new VerticalPanel();
vp.setSpacing(3);
for (int i = 0; i < 5; i++) {
vp.add( new Label("MyLabel-"+i));
}
data = new TableData();
data.width = "70%";
c.add(vp,data);

VerticalPanel vpr = new VerticalPanel();
vpr.add(new Label("R"));
data = new TableData();
data.width = "15%";
c.add(vpr,data);

add(c, new CenterLayout());
}
}
}

darrellmeyer
16 May 2008, 9:56 AM
add(c, new CenterLayout ()); That is wrong. The second parameter is for the layout data, not the layout itself. You need to set the center layout on the window itself. Change above line with:


setLayout(new CenterLayout());

dbettoni
19 May 2008, 12:11 AM
I replaced the line

add (c, new CenterLayout ()); with

setLayout( new CenterLayout());
add(c);and I tried with


add(c);
setLayout( new CenterLayout()); but in both cases I get a blank window, perhaps there is a bug on CenterLayout?
see attached images at start and after enlargement

gslender
19 May 2008, 12:46 AM
I think the problem is that the container (c) in your code has no initial size, so it shrinks to the smallest non-visible size possible.

Try replacing the code with this... things should be visible, but won't be centered.


setLayout( new FitLayout());
add(c);

With layouts, I find it best to try one thing at a time... building the layout and containers to get what you need.

One thing that is stumping me - what is it you are trying to do?

gslender
19 May 2008, 12:48 AM
Another thing to try when using the CenterLayout - set the c layout's tablelayout.width = "100%"; // and do height too

zaccret
19 May 2008, 12:58 AM
add(c, new CenterLayout ()); That is wrong. The second parameter is for the layout data, not the layout itself.

To avoid such errors, could the layout be a parameter D in Container class (and then we have a mehod add(Widget,D)) ? Or could we have a LayoutData interface instead of Object ?

dbettoni
19 May 2008, 1:15 AM
One thing that is stumping me - what is it you are trying to do?

simply reproduce what I saw with code that run on MyGwt.
see "MyShell" image at start of this thread
and the MyGWT test code;



static class MyShell3VpEB extends Shell {

public MyShell3VpEB(String text) {
this();
setText(text);
}

public MyShell3VpEB() {
super(Style.CLOSE | Style.MODAL | Style.RESIZE);

WidgetContainer c= new WidgetContainer();
TableLayout tablelayout = new TableLayout(3);
tablelayout.setBorder(1);
c.setLayout(tablelayout);

VerticalPanel vpl = new VerticalPanel();
vpl.add(new Label("L"));
c.add(vpl);

VerticalPanel vp = new VerticalPanel();
vp.setSpacing(3);
for (int i = 0; i < 5; i++) {
vp.add( new Label("MyLabel-"+i));
}
c.add(vp);

VerticalPanel vpr = new VerticalPanel();
vpr.add(new Label("R"));
c.add(vpr);

getContent().setLayout(new CenterLayout());
getContent().add(c);
}
}

gslender
19 May 2008, 1:46 AM
did you try centerlayout and tablelayout.width = "100%";

dbettoni
19 May 2008, 2:06 AM
yes,
if I add tablelayout.width = "100%" and remove setLayout (new CenterLayout ());
I get the window you can see below.
If I don't delete the line setLayout (new CenterLayout ()) still get a blank window.

gslender
19 May 2008, 6:21 PM
Mmmm, you certainly do have an interesting problem... /:)

I now agree that something is a miss and I also can't seem to figure out how to make this simple layout work... It has something to do with the "Container c" not being sized correctly, and yet the CenterLayout should do this - but it isn't. :-?

Darrell, are you able to shed some light on this???