GWT composite dynamic height resize

Question

I Have a GWT Composite to which some other Composites are added dynamically. I want to make may Parent composite Resize to fit the height of all its child widgets automatically. i tried setting setHeight("100%") for Composite but this doesn’t work. any Idea how to accomplish this functionality?

thanks. EDIT:

final DockLayoutPanel dockLayoutPanel = new DockLayoutPanel(Unit.EM);
    dockLayoutPanel.setStyleName("EntryPanel");
    dockLayoutPanel.setSize("142px", "72px");
    initWidget(dockLayoutPanel);

    final VerticalPanel panel = new VerticalPanel();
    panel.setSize("140px", "72px");

    chckbxExport = new CheckBox("Export");
    putField(CommonPresenter.CONSTANTS.EXPORT, chckbxExport);

    dateBox = new DateBox();

    dateBox.addValueChangeHandler(new ValueChangeHandler<Date>() {
        @Override
        public void onValueChange(final ValueChangeEvent<Date> event) {
            dateChanged = true;
        }
    });

    panel.add(dateBox);

    final ListBox visibility = new ListBox();

    final Label lblVisibility = new Label("Visibility:");
    LabeledWidget vis = new LabeledWidget(lblVisibility, visibility);

    for (int i = 0; i < CommonPresenter.CONSTANTS.VISIBILITIES.length; i++) {
        visibility.addItem(CommonPresenter.CONSTANTS.VISIBILITIES[i]);
    }

    putField(CommonPresenter.CONSTANTS.VISIBILITY, visibility);

    panel.add(vis);
    panel.add(chckbxExport);

    dockLayoutPanel.add(panel);

UPDATE: Setting Composite width to fill all available Window horizontal space:

 final int scrollBarWidth = 25;
// editPanel.setHeight("180px");
setWidth(Window.getClientWidth() - scrollBarWidth + "px");
// editPanel.setStyleName("EditorPanel");

Window.addResizeHandler(new ResizeHandler()
{
  public void onResize(ResizeEvent event)
  {
    int width = event.getWidth();
    setWidth(width - scrollBarWidth + "px");
  }
});

Chris Lercher Chris Lercher · Accepted Answer · 2010-12-21T08:31:53

Here's how to do it generally with HTML+CSS:

Create the parent, and do not set its height (or set it to auto).
Then add the children (just make sure, that you don't use absolute/fixed positioning for the children).
Set the height of the children, if required.

The height of the parent will then be adjusted automatically. This is the same for GWT Composites - just make sure, which CSS (including style attributes) applies to your elements! If unsure, use Firebug.

If you need more specifics, then you'd have to post some code which shows how you construct the parent composite (UiBinder, ...?)

GWT composite dynamic height resize

3 Answers