Loading...
Important Notice - Forums is archived

To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Product icon
TUTORIAL

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.

Grid layout problem

Hugues Van Eylen
1 decade ago May 10, 2010 12:24pm

Hi,
I want to construct a kind of portal framework in pure Vaadin. I use the gridlayout in order to place the portlets (kind of panel) inside a window. I can reorder my display at will. I use the grid to create a display of 4 columns to 2 rows and decide that from the portal point of view, it only have 2 columns : the first of size 1 column (grid) and the second of size 3 columns (grid) :

---------------------------------
|______|_____________|
---------------------------------
|__P2__|________P3___|
---------------------------------

If I switch P3 with P2 one time, it works well, but if I try to switch one more time, I obtain the following display :

----------------------------------
| __|_________________|
----------------------------------
| P3|________P2______|
----------------------------------

P3's column becomes smaller and smaller at each following switch....

Here is the code for this particular problem :

package com.example.testgridlayout;

import com.vaadin.Application;
import com.vaadin.ui.*;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Button.ClickListener;

public class TestgridlayoutApplication extends Application {

private Panel panel1;
private Panel panel2;
private Panel panel3;
private GridLayout grid;


@Override
public void init() {
Window mainWindow = new Window("Testgridlayout Application");
VerticalLayout structure = new VerticalLayout();
structure.setWidth("100%");
structure.setHeight("100%");
structure.setMargin(true);
structure.setCaption("Test GridLayout");
Button switchBtn = new Button("switch Pane 2 and 3");

switchBtn.addListener(new ClickListener(){

@Override
public void buttonClick(ClickEvent event) {
doSwitchPane();

}

});
structure.addComponent(switchBtn);
buildGrid();
structure.addComponent(grid);
mainWindow.addComponent(structure);


setMainWindow(mainWindow);
}

GridLayout buildGrid(){
grid = new GridLayout(4,2);
grid.setWidth("100%");
grid.setHeight("100%");
panel1 = new Panel("Pane 1");
panel1.setSizeFull();
grid.addComponent(panel1, 0,0,3,0);
panel2 = new Panel("Pane 2");
panel2.setSizeFull();
grid.addComponent(panel2, 0,1);
panel3 = new Panel("Pane 3");
panel3.setSizeFull();
grid.addComponent(panel3, 1,1,3,1);
return grid;
}
public void doSwitchPane(){
grid.removeComponent(panel2);
grid.removeComponent(panel3);
grid.addComponent(panel3, 0,1);
grid.addComponent(panel2, 1,1,3,1);
}

}

In fact, as you can see, after the first switch, i only remove the components and add them at the same place.
It's not here a real switch but that does not explain the behaviour displayed.

Any idea if I have done something wrong ?

Thanks

tommix vim
1 decade ago May 17, 2010 8:37pm
Jouni Koivuviita
1 decade ago May 18, 2010 7:16am