custom header style on CellTable

895 views
Skip to first unread message

Rodrigue Lagoue

unread,
Oct 22, 2010, 8:33:05 AM10/22/10
to google-web-toolkit
Hi all,

does somebody know, if it is possible to customize the headers' style of a CellTable. I would like to have for exemple header that looks like a button...

Many thanks for any help.
Rodrigue

Thomas Broyer

unread,
Oct 22, 2010, 9:11:19 AM10/22/10
to Google Web Toolkit


On 22 oct, 14:33, Rodrigue Lagoue <rlag...@googlemail.com> wrote:
> Hi all,
>
> does somebody know, if it is possible to customize the headers' style of a
> CellTable. I would like to have for exemple header that looks like a
> button...

If you can do it entirely with CSS, then extend the CellTable.Resource
and CellTable.Style to provide your own .cellTableHeader (and
possibly .cellTableFirstColumnHeader and/
or .celltableLastColumnHeader), and pass it to the constructor.
This is used in the DynatableRf sample:
http://code.google.com/p/google-web-toolkit/source/browse/trunk/samples/dynatablerf/src/com/google/gwt/sample/dynatablerf/client/widgets/SummaryWidget.java#68

Otherwise, you can provide your own Header implementation when adding
a column, instead of giving the header as just the text (as a String).
That way, you can generate the HTML snippet you want for your headers.
This is used in the Expenses sample to make the table "sortable":
http://code.google.com/p/google-web-toolkit/source/browse/trunk/samples/expenses/src/main/java/com/google/gwt/sample/expenses/client/SortableHeader.java
http://code.google.com/p/google-web-toolkit/source/browse/trunk/samples/expenses/src/main/java/com/google/gwt/sample/expenses/client/ExpenseReportList.java#456

You can of course use both at the same time, as is done in the
Expenses sample:
http://code.google.com/p/google-web-toolkit/source/browse/trunk/samples/expenses/src/main/java/com/google/gwt/sample/expenses/client/ExpenseReportList.java#463

Rodrigue Lagoue

unread,
Oct 22, 2010, 1:11:38 PM10/22/10
to google-we...@googlegroups.com
thanks thomas

I start to use the cell widgets in my project tomorrow.


--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To post to this group, send email to google-we...@googlegroups.com.
To unsubscribe from this group, send email to google-web-tool...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.


John LaBanca

unread,
Oct 22, 2010, 9:49:35 PM10/22/10
to Google Web Toolkit
The easiest way to have a button in a Header is to create a Header
with a ButtonCell
ButtonCell buttonCell = new ButtonCell();
Header myHeader = new Header(buttonCell);
myTable.addColumn(column, myHeader);

You can also extend the ClientBundle defined in CellTable.Resource/
Style as tbroyer suggests. The CSS dev guide has more info:
http://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html

On Oct 22, 9:11 am, Thomas Broyer <t.bro...@gmail.com> wrote:
> On 22 oct, 14:33, Rodrigue Lagoue <rlag...@googlemail.com> wrote:
>
> > Hi all,
>
> > does somebody know, if it is possible to customize the headers' style of a
> > CellTable. I would like to have for exemple header that looks like a
> > button...
>
> If you can do it entirely with CSS, then extend the CellTable.Resource
> and CellTable.Style to provide your own .cellTableHeader (and
> possibly .cellTableFirstColumnHeader and/
> or .celltableLastColumnHeader), and pass it to the constructor.
> This is used in the DynatableRf sample:http://code.google.com/p/google-web-toolkit/source/browse/trunk/sampl...
>
> Otherwise, you can provide your own Header implementation when adding
> a column, instead of giving the header as just the text (as a String).
> That way, you can generate the HTML snippet you want for your headers.
> This is used in the Expenses sample to make the table "sortable":http://code.google.com/p/google-web-toolkit/source/browse/trunk/sampl...http://code.google.com/p/google-web-toolkit/source/browse/trunk/sampl...
>
> You can of course use both at the same time, as is done in the
> Expenses sample:http://code.google.com/p/google-web-toolkit/source/browse/trunk/sampl...

Rodrigue Lagoue

unread,
Oct 25, 2010, 7:11:53 AM10/25/10
to google-we...@googlegroups.com
Thanks John, I also think the way with Cells is easier one.

Reply all
Reply to author
Forward
0 new messages