How to get the right height for a table and for a panel

Hi

I have a VerticalLayout as the main layout with height and width set to 100%. I have put inside a HorizontalSplitPanel. In each side I have to put a table and a panel. Both must fill the available space in width and height. How can I make the table and the panel to match the layout space available, and show a vertical scroll bar if required. Table height and vertical scroll is managed with the number of items, and panel height cannot be set to 100% because in such case the vertical scroll bar is not shown. But the fact is the screen size is unknown, and the browser window can be resized.

How can both types of components make fit the available space dynamically?

Thanks

Hi,

You're on the right track. The trick with Panels is that you can tell the Panel to be 100% wide/high, but in order to get scrollbars if the contents grows, you must set the size of the contents to undefined. So something like the following should get a full sized panel with scrollable content:

myPanel.setSizeFull();
myPanel.getContent().setSizeUndefined();

The Table should not pose a problem at 100% size.

HTH,
/Jonatan

Thanks for the reply, but I cannot get it work. This is my sample test code

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

public class TestscrollsApplication extends Application {
	@Override
	public void init() {
		final Window mainWindow = new Window("Testscrolls Application");
		Label label = new Label("Hello Vaadin user");
		mainWindow.addComponent(label);
		setMainWindow(mainWindow);
		mainWindow.getContent().setSizeFull();
		mainWindow.addComponent(new Button("restart", new Button.ClickListener() {

			public void buttonClick(ClickEvent event) {
				mainWindow.getApplication().close();
			}
		}));
		VerticalLayout vl = new VerticalLayout();
		mainWindow.addComponent(vl);
		vl.addComponent(new Label("6"));
		vl.setSizeFull();
		buildPanel(vl);
	}

	void buildPanel(Layout layout) {
		final Panel panel = new Panel("Scrolling Panel");
		panel.setSizeFull();
		panel.setScrollable(true);
		panel.getContent().setSizeUndefined();
		for (int i = 0; i < 100; i++) {
			panel.addComponent(new Label("" + i));
		}
		layout.addComponent(panel);
	}
}

I get all the components in the screen,the panel has a vertical scroll bar and when the window is resized all is resized as well to fit in the screen. The issue is the all the components have the same vertical size and I want the label and the button have it's own vertical size and the panel fill the remaining available space. How to get it?

And if I have a table instead of the panel, how to get the table rows fill the available space with a vertical scroll bar if required?

Thanks
Aniceto

Aniceto P Madrid: I get all the components in the screen,the panel has a vertical scroll bar and when the window is resized all is resized as well to fit in the screen. The issue is the all the components have the same vertical size and I want the label and the button have it's own vertical size and the panel fill the remaining available space. How to get it?

Oh, now I understand. Yes, Vertical- and HorizontalLayout distribute space evenly between components, unless you specify expand ratios for the components in the layout. So in your case, you want to specify an expand ratio of 1 for your panel, which will cause the panel to grab all extra space, and the other components will just use what is needed for them to display properly.

layout.setExpandRatio(panel, 1.0f);

And if I have a table instead of the panel, how to get the table rows fill the available space with a vertical scroll bar if required?

The table should automatically handle all necessary scrolling if you set a size for it (not undefined). So setSizeFull and the setExpandRatio like for the panel should give you the same kind of layout as above, but with the panel replaced with a table. This is provided that I understood you correctly, that is.

HTH,
/Jonatan