Question

From this link the author suggested:

table.setWidth("100%", true);
table.setColumnWidth(nameColumn, 35.0, Unit.PCT);
table.setColumnWidth(addressColumn, 65.0, Unit.PCT);

for CellTable column width to work, however in my project the nameColumn contain an extra long text, then this column will occupy almost all browser view, apparently the column width does not work, Could anybody shed some light on this?

The nameColumn defined as below:

        TextColumn<Person> nameColumn = new TextColumn<Person>()
        {

            @Override
            public String getValue( Person object )
            {
                return object.getUserName();
            }
        };

Answer 1

You can use following method to set custom style on the column cell:

nameColumn.setCellStyleNames("name-cell");

The following structure is generated(in DOM) for the cell:

<td class="xxxxxxxx xxxxxx name-cell">
   <div style="outline:none;">Very long name ...</div>
</td>

So you have to define following css classes to set the wanted style and limit the cell and text size:

.name-cell {
...
}

.name-cell div {
...
}

Update

I tested the method table.setColumnWidth( and works well for me.
Here is how I do it:

• Table constructed by UI binder

• Create columns

• Set table width

• add columns to the table

• set column width (with table.setColumnWidth )

When you calculate the cell width don’t forget to take padding into account.

Used GWT 2.4