GWT: how to change celltable alternate row background colors - gwt

Question

I am trying to change my celltable alternate rows background colors.
by default they have white and lite blue color .. is there a possibility i can change these colors to lets say white and red..
attached is the screenshot .. you can see a white and blue color rows .. if there is a solution to change these colors.
I am aboe to change color , but it looks like it is changin each cell color and not the complete background , see the attached image , any way i can avoid these white spaces.
this is my css
.cellTableEvenRow {
}
.cellTableOddRow {
background: powderblue !important;
}
.cellTableEvenRowCell {
}
.cellTableOddRowCell {
}
thanks

Answer 1

You have to provide a custom CellTable.Resources instance.
To do that you have to create sub-interfaces of CellTable.Resources and CellTable.Style. In the your custom CellTable.Resources you can add your own CSS file in addition to the default style:
public interface CustomResources extends CellTable.Resources {
#Source({Style.DEFAULT_CSS, "CustomCellTable.css"})
Style cellTableStyle();
}
public interface CustomStyle extends CellTable.Style {
}
Now you can specify your custom style in the CustomCellTable.css:
.cellTableEvenRow {
background: white;
}
.cellTableOddRow {
background: red;
}
To create an instance of your custom CellTable.Resources simply call:
CellTable.Resources res = GWT.create(CustomResources.class)
Now you can give that instance to the CellTable instance using its constructor:
CellTable cellTable=new CellTable(15, res);
15 is the default page but can be changed. CellTable has no constructor with only the resources as parameter. At least the page size has to be specified.