How create GridLayout with empty cell

General
1

hello,

I have trouble for creating a GridLayout with empty cell in it :

for exemple :

i would create a GridLayout(3,2) like the image, and put 3 elements in it

the first on (0,0,0,1)
the second on (1,1)
the third on (1,2)

it’s easy to make this with html table and rowspan, but i cant do this with vaadin…

the second and third element are placed on the middle of the two cell…

2

For whatever reason, Vaadin’s GridLayout uses (COL,ROW) pairing, which throws me every time because the rest of the world looks at a grid as (ROW,COL).

Your third element should be on (2,1). Of course, don’t know if that solves your issue or not, but GridLayout has worked okay for me though I’ve done my COLSPAN-like configuration than ROWSPAN. Good luck!

3

thx for the reply but… i still dont understand…

there is another example more descriptif :

	GridLayout test2 = new GridLayout(3,2);
		Panel pan = new Panel();
		pan.addComponent(new TextField("cell 1"));
		pan.addComponent(new TextField("cell 2"));
		
		test2.addComponent(pan,0,0,0,1);
		test2.addComponent(new TextField("cell 3"),1,1);
		test2.addComponent(new TextField("cell 4"),2,1);
		test2.setWidth(100, UNITS_PERCENTAGE);

result :

its not the result i expect… i want label : cell 3 and cell 4 align with label cell 2.

4

Again, not really sure, but your cell1 and cell2 are not directly in the grid, but are in another container (panel) that you stored in the grid, so those two cells won’t be aligned with other cells you put directly in the grid.

5

Well, actually the solution is there.
You just have to set the rowspan and colspan for all the empty cells.
For the example, you explained in your first post, I’d create a dummy Label with a Color similar to the background and add it by .addComponent(1,0,2,0);
Worked for me!

Apexys