Hi,
I am attempting to adjust a DataGridView to have wider column borders. I only want this for a single DataGridView in the application.
I have created table.mixin.theme …
{
“appearances”: {
“table-cell-5”: {
“inherit”: “table-cell”,
“states”: {
“default”: {
“styles”: {
“widthRight”: 5
}
}
}
}
},
“appearances”: {
“table-header-cell-5”: {
“inherit”: “table-header-cell”,
“states”: {
“default”: {
“styles”: {
“width”: [ 0, 5, 0, 0 ]
}
}
}
}
}
}
But I can’t work out now how to apply this to the DataGridView.
Can you advise?
Cheers,
Neil
The DataGridView is a complex widget with several independent parts that render their internals as HTML for speed, plus actual widgets (the headers) and they have various styles (appearance keys) in the theme.
Overriding a cell renderer is easy, the DataGridViewColumn and DataGridViewCell objects have the CellRenderer property that lets you set a custom javascript renderer. For the javascript part, you can simply derive from the basic existing renderer: wisej.web.datagrid.cellRenderer.Cell. BTW, all the renderers and js code is here: https://github.com/iceteagroup/wisej-js
The cell renderer can change the appearance key.
For the column header it’s different since those are actual widgets (while cells are not, they are the rendering result of a panel in the grid). But you can override the base column class and change the appearnce key of the header widget. This should be easier in the future.
See attached sample project. It’s simple but you need to know where to change things. I hope it’s enough to get you started.
Please login first to submit.
