Hi,
I have a DataGridView which I am populating from a BindingList<MyCustomClass> which implements INotifyPropertyChanged to keep everything up to date.
Inside my custom Class I have a Background Color and I attach to the DataBindingComplete event and set the BackGround Color Of a Specific Cell.
foreach (var row in MyGrid.Rows) {
var rowTag = row.DataBoundItem as MyCustomClass;
row.Cells[dgvcStatusCell].Style.BackColor = rowTag.BackGroundColor;
}
This all works perfectly.
If possible, I would like to extend this further and rather than color the entire cell, I would like to draw a circle in that cell and fill the circle with the specified color. the circle color will change (as it represents a status) so I would like to bind it to the BackGround Color of the BindingList as this will automatically get updated via a custom WebSocket message.
In another custom UserControl I have, I was able to create a circle cheaply by setting a label and inside the Labels CSS-Style set border-radius: 12px; which works well and serves my purpose.
I’m not exactly sure where I should begin with creating the circle in the cell and any pointers or samples would be appreciated.
Thanks,
Brayden.
When you set the RowHeight that’s the height, you’d have to add the padding. Otherwise you can add internal padding in the theme or a theme mixin.
You can draw in any cell using the CellPaint event. It fires for cells that have the UserPaint property set to true.
See attached modified sample. You can simply use an HTML string. I added a StatusColorString property to the data source and set AllowHtml = true to the column that should show the circle. There is no flickering and you can display anything you can render with HTML.
public string StatusColorString { get { return $"<div style='width:24px;height:24px;border-radius:100%;background-color:{ColorTranslator.ToHtml(this.StatusColor)}'></div>"; } }
Sample App
Forgot, you can also set custom CSS for any cell or row by assigning the CssClass or CssStyle properties of a DataGridViewCellStyle associated with the cell or row or grid.
Please login first to submit.