Hello,
I'm trying to change row style in a treegrid only for some rows.
Based on some logic, I want to gray the text and/or make it italic.
I found some posts for background colors but not for text.
I first tried to override render in TreeGridCellRenderer:
Code:
@Override
public Object render(final ModelData model, String property, final ColumnData config,
final int rowIndex, final int colIndex, ListStore<ModelData> store, final Grid<ModelData> grid) {
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
@Override
public void execute() {
if(model != null) {
Object myBoolean = model.get("myboolean");
if(myBoolean != null && ((Boolean)myBoolean)) {
grid.getView().getRow(rowIndex).getStyle().setColor("gray");
//here I cannot find any way to set the text as italic for the row
// I also trid with config.style=".." but it seems to work cell only for backgroud color
}
}
}
});
return super.render(model, property, config, rowIndex, colIndex, store, grid);
}
This works for the "color" attribute. (note that I had to remove color:black from gxt css for x-tree3-node-text)
but using the deferred command create a tiny - but visible - latency in style update.
Then I tried to use a GridViewConfig
Code:
tree.getView().setViewConfig(new GridViewConfig(){
StringBuilder sb = new StringBuilder();
if(model != null) {
Object myBoolean = model.get("myboolean");
if(myBoolean != null && ((Boolean)myBoolean)) {
sb.append(" inactive"); // css : .inactive { color:gray; }
}
Object myBoolean2 = model.get("myboolean2");
if(myBoolean2 != null && ((Boolean)myBoolean2)) {
sb.append(" noSelectable"); // .noSelectable { font-style:italic; }
}
}
});
return super.render(model, property, config, rowIndex, colIndex, store, grid);
}
This works better (no latency) for the gray color but still not for italic.
The style applies on <tr> (in firebug) but seems to be overriden by text style of the cells (?). The computed style is italic for text from row start <div> to the first <td> in which it is normal.
For this <td> in firebug, if i remove (even just the 11px)
Code:
.x-grid3-hd-row .x-grid3-hd, .x-grid3-row .x-grid3-cell, .x-grid3-summary-row .x-grid3-cell {
font: 11px arial,tahoma,helvetica,sans-serif;
}
I got italic on all columns of the required row but not for the tree cell. And the text lose its size ...
I cannot find any css to remove or add to have the tree cell in italic ...
I think I saw something about using a widget renderer for the tree cell styling but it makes too much code for a so simple use case. So I didn't try.
What should I do ? I really miss CSS skill and I guess I'm not so far of the solution ...
Should I remove the text style for cells (how ?)
Hope someone will have an idea !
Regards
David