If I do the below, I get layout errors when I do ‘Analyze layouts’:
Vaadin DEBUG
MainWindow/963d9a “” (height: MAIN WINDOW)
VerticalLayout/1a0f02a (height: UNDEFINED)
VerticalLayout/f78672 (height: RELATIVE, 100.0 %)
Layout problem detected: Component with relative height inside a VerticalLayout with no height defined.
Relative sizes were replaced by undefined sizes, components may not render as expected.
How do I correct this?
Thanks,
Mark
package com.refineddata.cvm.gui;
import com.vaadin.ui.Label;
import com.vaadin.ui.VerticalLayout;
import com.vaadin.ui.Window;
@SuppressWarnings("serial")
public class MainWindow extends Window {
public MainWindow(){
VerticalLayout vl = new VerticalLayout();
vl.setSizeFull();
Label label = new Label("Hello Vaadin user");
vl.addComponent(label);
this.addComponent(vl);
}
}
A layout with undefined size can’t contain a component with relative size.
In this case, the MainWindow’s layout has undefined size, and you put another VerticalLayout inside it with a relative size. Either:
do [tt]
getContent().setSizeFull()
[/tt] or
don’t create another VerticalLayout inside the window’s layout, but use “[tt]
VerticalLayout vl = (VerticalLayout) getContent();
[/tt]”; or just use “[tt]
addComponent(label);
[/tt]” for the Window object, not to the layout.
public MainWindow(){
this.getContent().setSizeFull();
//this.getContent().setHeight("150px");
VerticalLayout vl = new VerticalLayout();
vl.setSizeFull();
Label label = new Label("Hello Vaadin user");
vl.addComponent(label);
this.addComponent(vl);
}
If I set the height to 150px, then the label displays, but if I comment that out, blank screen, with the following info from Analyze Layouts:
–snip
Client side notifications
The following relative sized components were rendered to a zero size container on the client side. Note that these are not necessarily invalid states, but reported here as they might be.
Vertically zero size:
VVerticalLayout inside VVerticalLayout
Emphasize components parent in UI (the actual component is not visible)
–snip
Strange. Copy&paste…test…works ok (in Vaadin 6.4.5). Works for me, so I have no idea what that problem could be. Perhaps use firebug to see if there is a more serious problem?
Oh, your application class doesn’t show in your code there. Perhaps you do something bad to the window object after creating it?
which suggests updating the css (click the middle icon) as such:
.v-generated-body {
overflow: auto;
}
.v-generated-body .v-app {
height: auto;
}
which causes the effect I noted previously. I removed my application theme and saw the problem disappear, so I knew there was a css issue. Sigh. I’ll be taking out the offending css now and it’ll be fixed.