Minimizing CellTable height inside center area of DockLayoutPanel

[Todd Pepin]

Hi,

I'm using a DockLayoutPanel for my app's main panel. In the center
area, I'd like to display a CellTable. However I'm struggling with
layout. With my current code, if the CellTable has few rows - not
enough to fill the height of the center area - the table header
expands to fill the entire center panel. I'd like to have the table
header be just large enough to display the header text, and then
vertically align at the top of of the center area.

|-------------------------------
| Menu Bar
|------------------------------------
| Column1 Column2 Column 3
|-----------------------------------------
|
| (empty space if no row data)
|
|-----------------------------------------

How is this best accomplished? Maybe I'm doing this wrong and I should
be doing some entirely different layout widget.

I'm using FireFox 4.0.1, not sure if that matters.

- Todd

Sample code:

package com.somecompany.sample.client;

import java.util.Date;

import com.google.gwt.cell.client.DateCell;
import com.google.gwt.cell.client.NumberCell;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.dom.client.Style.Unit;
import com.google.gwt.user.cellview.client.CellTable;
import com.google.gwt.user.cellview.client.Column;
import com.google.gwt.user.cellview.client.TextColumn;
import com.google.gwt.user.client.Command;
import com.google.gwt.user.client.ui.DockLayoutPanel;
import com.google.gwt.user.client.ui.MenuBar;
import com.google.gwt.user.client.ui.MenuItem;
import com.google.gwt.user.client.ui.RootLayoutPanel;
import com.google.gwt.user.client.ui.Widget;

/**
* Entry point classes define <code>onModuleLoad()</code>.
*/
public class SampleLayout implements EntryPoint
{
/**
* Keep a convenience handle on the root panel
*/
public RootLayoutPanel rootLayoutPanel;

/**
* This is the main panel for the application
*/
public DockLayoutPanel dockLayoutPanel;

/**
* Keep a handle on the dock panel's center widget, we want to
change this dynamically
*/
public Widget dockPanelMainWidget;

/**
* Show just the menu bar when app is initially loaded
*/
public void onModuleLoad()
{
rootLayoutPanel = RootLayoutPanel.get();

dockLayoutPanel = new DockLayoutPanel(Unit.EM);
rootLayoutPanel.add(dockLayoutPanel);

MenuBar menuBar = new MenuBar(false);
dockLayoutPanel.addNorth(menuBar, 2);

MenuBar menuBar_1 = new MenuBar(true);
MenuItem mntmFile = new MenuItem("File", false, menuBar_1);

MenuItem mntmRetrieveFiles = new MenuItem("Save", false, (Command)
null);
menuBar_1.addItem(mntmRetrieveFiles);

MenuItem mntmAddLocations = new MenuItem("Edit", false, new
EditCommand());
menuBar_1.addItem(mntmAddLocations);

menuBar.addItem(mntmFile);

}


/**
* Local private class to store the File locations we're going to
display
*/
private class FileLocation
{
public String serverName;
public String directoryName;
public Integer numFiles;
public Date lastSearched;

public FileLocation(String serverName, String directoryName,
Integer numFiles, Date lastSearched)
{
this.serverName = serverName;
this.directoryName = directoryName;
this.numFiles = numFiles;
this.lastSearched = lastSearched;
}

}

/**
* GUI commend executed from menu items to edit file locations
*/
public class EditCommand implements Command
{
public void execute() {
SampleLayout.this.showLocationsGrid();
}

}

/**
* Show the list of root locations we search for files in
*/
public void showLocationsGrid()
{
/* delete the contents of the current browser pain */
if (dockPanelMainWidget != null) {
dockLayoutPanel.remove(dockPanelMainWidget);
}

/* add new contents - ie a grid that lists locations to search */
CellTable<FileLocation> table = new CellTable<FileLocation>();

// Add a text column to show the server name
TextColumn<FileLocation> serverNameColumn = new
TextColumn<FileLocation>() {
@Override
public String getValue(FileLocation object) {
return object.serverName;
}
};
table.addColumn(serverNameColumn, "Server Name");

// add a text column to show the directory name
TextColumn<FileLocation> directoryNameColumn = new
TextColumn<FileLocation>() {
@Override
public String getValue(FileLocation object) {
return object.directoryName;
}
};
table.addColumn(serverNameColumn, "Server Name");

// add an integer column to show the number of Files in that
location
NumberCell numberCell = new NumberCell();
Column<FileLocation, Number> numberColumn = new
Column<FileLocation, Number>(numberCell) {
@Override
public Integer getValue(FileLocation object) {
return object.numFiles;
}
};
table.addColumn(numberColumn, "Num Files");

// add an date column to show the last time the location was
searched for new Files
DateCell dateCell = new DateCell();
Column<FileLocation, Date> dateColumn = new Column<FileLocation,
Date>(dateCell) {
@Override
public Date getValue(FileLocation object) {
return object.lastSearched;
}
};
table.addColumn(dateColumn, "Last Searched");

/* setting the row count stops the loading widget from displaying
*/
table.setRowCount(0);

/* this doesn't appear to do anything */
table.setHeight("2");

dockLayoutPanel.add(table);

}

}

[George Agiasoglou]

Trying adding the celltable to a scrollpanel/simplepanel and then add the scrollpanel to the docklayout panel.