I have a listview with 5 columns, I want the 4th column of each row of the list box to have a backcolor which is specified by the user, (it's a visual representation of what they will see later in the program) I created a ListViewDataItem to capture all the info to be displayed in the listview, but I can't seem to get it to change the backcolor of a specific column.
please advise.
thanks
Jason
9 Answers, 1 is accepted
Thank you for writing.
The desired result can be achieved by handling the formatting events in RadListView. Since you are having the control set up in DetailsView, you will need to handle the CellFormatting event. Please check the following documentation article providing additional information and an example: https://docs.telerik.com/devtools/winforms/listview/customizing-appearance/formatting-items.
I hope this helps. Should you have further questions please do not hesitate to write back.
Regards,
Hristo
Progress Telerik
Rank 1
What is the trigger to force radlistview.CellFormatting to fire? I followed the code you linked to, but the CellFormatting event is not firing.
thanks
Rank 1
Thank you for writing back.
RadListView is a virtualized control and the formatting events provide means to access the visual elements which are reused for the different data items. By evaluating the underlying data items you should be able to perform a conditional formatting of the cells. It is also important to also reset the value, otherwise, the changed visual settings in the event handler for one UI cell may be copied to another which will not be desired.
The formatting events are triggered in various scenarios, whenever the control receives the focus or any of the data items has updated. Scrolling the control would also raise the event. Generally, it is not necessary to force it programmatically. If you need to, you can do it by forcing a synchronization between the data and the visual items:
this.radListView1.ListViewElement.SynchronizeVisualItems();Regarding your actual setup, you do not need to iterate the rows. The formatting event will be fired for each of the cells and then by evaluating the data item, you should be able to change the color. I am sending you attached my test project as well as a short video showing the result on my end.
I hope this helps. Should you have further questions please do not hesitate to write back.
Regards,
Hristo
Progress Telerik
Rank 1
Thank you for writing back.
You can follow the same approach and style individual cells within the same column. The Data property of the cell exposes the column which you can validate against your data objects by the FieldName. Then you can perform an additional validation for each of the cells.
private void radListView1_CellFormatting(object sender, ListViewCellFormattingEventArgs e){ DetailListViewCellElement cell = e.CellElement as DetailListViewCellElement; if (cell.Data.FieldName != "Address") { return; } if (cell.Text.StartsWith("5")) { cell.GradientStyle = GradientStyles.Solid; cell.BackColor = Color.Red; } else if (cell.Text.StartsWith("7")) { cell.GradientStyle = GradientStyles.Solid; cell.BackColor = Color.Blue; } else { cell.ResetValue(LightVisualElement.GradientStyleProperty, ValueResetFlags.Local); cell.ResetValue(LightVisualElement.BackColorProperty, ValueResetFlags.Local); }}Please also check the attached screenshot. In case, you need further assistance or your scenario is different please send me your project so that we can test it locally.
I hope this helps. Should you have further questions please do not hesitate to write back.
Regards,
Hristo
Progress Telerik
Rank 1
Your code assume you know what the text is for a particular cell, I do not know this information. I would like to use the cell.tag to determine the back color, but it is always null in the CEll_formatting event
Here is a sample
ListViewDataItem itm = new ListViewDataItem
itm.SubItems.Add(fontstring);
itm.SubItems.Add(" ");
itm.Tag = Color.Red;
listCategories.Items.Add(itm);
listCategories.CellFormatting += listCategories_CellFormatting;
private void listCategories_CellFormatting(object sender, ListViewCellFormattingEventArgs e)
{
DetailListViewCellElement cell = e.CellElement as DetailListViewCellElement;
if (cell.Tag != null)
{
cell.BackColor = Color.Red;
}
}
Thanks
Thank you for writing back.
I would like to point that the SubItems collection should not be used to populate the list view at run-time, that is why it is not browsable. If you follow the approach demonstrated here you will be able to apply a Tag to a data item in the designer and then access it in the formatting event through the data item. Please also note that the data item and visual cell element are two separate objects and Tag of the data item will not be set to the cell element.
You can follow any of the two approaches in the attached project. Since you are populating the items from code you may consider data binding the control. You can also add items in unbound mode: https://docs.telerik.com/devtools/winforms/listview/populating-with-data/unbound-mode.
I hope this helps. Please let me know if you need further assistance.
Regards,
Hristo
Progress Telerik
Rank 2
Iron
Iron
Iron
Why the code above does not work in VB?
I converted the code in C# to VB and I don't get the same behavior.
Private Sub RadListView1_CellFormatting(sender As Object, e As ListViewCellFormattingEventArgs) Handles RadListView1.CellFormatting
e.CellElement.ImageLayout = ImageLayout.Zoom '--- this code resize the .svg file from column "Status"
Dim cell As DetailListViewCellElement = TryCast(e.CellElement, DetailListViewCellElement)
If cell.Data.HeaderText <> "Truss Mark" Then
Return
End If
If cell.Text.StartsWith("S") Then
cell.GradientStyle = GradientStyles.Solid
cell.BackColor = Color.Red
ElseIf cell.Text.StartsWith("T") Then
cell.GradientStyle = GradientStyles.Solid
cell.BackColor = Color.Blue
Else
cell.ResetValue(LightVisualElement.GradientStyleProperty, ValueResetFlags.Local)
cell.ResetValue(LightVisualElement.BackColorProperty, ValueResetFlags.Local)
End If
End Sub
It is filling the header and not the rows
Rank 2
Iron
Iron
Iron
Thank you for the provided project. This behavior comes from using a Fluent theme. Different themes have different structures and settings. In your case, the cells in the Fluent theme are styled in a different way than other themes. To set the color of the cells, you can set the DrawFill property to true.
Private Sub RadListView1_CellFormatting(sender As Object, e As ListViewCellFormattingEventArgs) Handles RadListView1.CellFormatting
e.CellElement.ImageLayout = ImageLayout.Zoom '--- this code resize the .svg file from column "Sign"
Dim cell As DetailListViewCellElement = TryCast(e.CellElement, DetailListViewCellElement)
If cell.Data.HeaderText <> "TM" Then
Return
End If
If cell.Text.StartsWith("TM1") Then
cell.GradientStyle = GradientStyles.Solid
cell.BackColor = Color.Red
cell.DrawFill = True
ElseIf cell.Text.StartsWith("TM4") Then
cell.GradientStyle = GradientStyles.Solid
cell.BackColor = Color.Blue
cell.DrawFill = True
Else
cell.ResetValue(LightVisualElement.GradientStyleProperty, ValueResetFlags.Local)
cell.ResetValue(LightVisualElement.BackColorProperty, ValueResetFlags.Local)
cell.ResetValue(LightVisualElement.DrawFillProperty, ValueResetFlags.Local)
End If
End SubHere is the result on my side.
Rank 2
Iron
Iron
Iron