vaadin 7.6.6 , valo thema, expandable layout

Vaadin 6 / 7 / 8
1

I migrated my program from vaadin version 7.0.1 to version 7.6.6. In some time I changed the basice program’s thema to Valo thema. In one part grid I used to show diferent widgets (text box, label, ,button and table) , there is vertical layout which don’t show data at the start of application.
There is funcionaliti when different labels can be show in that vertical layot . On previous program version (when I use vaadin version 7.0.1 and basice thema for app layout ) the vertical layout was expandable, when it is empty it had minimal heigth and when app create labels and add dinamicly in CssLayoute which are its part , the vertical layout was expanded. Now with valo thema and new vaadin version , I have not some functionality.
I tried to set the vertical layout and all components in it on undefine size using widgete.setHeight(“100%”) and similar statement, but nothing helped.

Thanks for your help

2

Hi Angela,

setting the size to undefined is not by saying
setHeight(“100%”)
 but rather
setSizeUndefined()
 (or
setHeightUndefined()
). The value internally is “-1” but better use official API.

If you can, I would suggest using Vaadin Designer (Plug-In for Eclipse) and create a Design there
(new->Vaadin->Vaadin Design). There you can play around with setting sizes to undefined or 100%
and get a feel of what happens when. Maybe even a good idea to re-create the view you want using it
All you need to do is give names to the components you want to control programmatically. Derive
from the auto-generated *.java class for the Design, and put the code for your new Composite view there.

Please let me know if this didn’t help.

Best,
Enver

3

Enver ,
thanks for your answer. I solved my problem for hiding more cssLayout objects in gridLayout when they are empty (there are not widgets ) and when they were inserted in encompassing VerticalLayout object. In fact, I needed adding style roles . There are show belowe.

div.v-csslayout {
display: block;
}

.v-csslayout {
position: relative;
overflow: hidden;
}