Remove column separator

[Malin]

Hi,

We want to remove the column separators in the RadListView control (DetailsView) and set the headers to align to the left (see the attached image).

We can do this in design view by going in to the Edit UI Elements-dialog and go to the DetailsListViewColumnContainers Children property and edit our two columns DrawBorder-property to false and TextAlignment-property to MiddleLeft. The problem is when we do that and run our project we get a runtime error, ArgumentOutOfRangeException, on the first row, of the ones down below. Is this not the way to remove the separators? Is there a better way to achieve this?

 

ArgumentOutOfRangeException on the first of these rows (more specifically the last GetChildAt() fails):

((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(0))).DrawBorder = false;((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(0))).TextAlignment = System.Drawing.ContentAlignment.MiddleLeft;((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(0))).Text = "Server";((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(1))).DrawBorder = false;((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(1))).TextAlignment = System.Drawing.ContentAlignment.MiddleLeft;((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(1))).Text = "Kommentar";

[Malin]

We are using version 2017.1.117.40

[Dess | Tech Support Engineer, Principal]

Hello, Malin,  

The appropriate way to customize cell elements in details view is to handle the CellFormatting event. Here is demonstrated a sample code snippet how to hide the borders and change the text alignment in the header cells:

private void radListView1_CellFormatting(object sender, Telerik.WinControls.UI.ListViewCellFormattingEventArgs e)
{
    DetailListViewHeaderCellElement headerCell = e.CellElement as DetailListViewHeaderCellElement;
    if (headerCell != null)
    {
        e.CellElement.DrawBorder = false;
        e.CellElement.TextAlignment = ContentAlignment.MiddleLeft;
    }
    else
    {
        e.CellElement.ResetValue(LightVisualElement.DrawBorderProperty, Telerik.WinControls.ValueResetFlags.Local);
        e.CellElement.ResetValue(LightVisualElement.TextAlignmentProperty, Telerik.WinControls.ValueResetFlags.Local);
    }
}

I hope this information helps. If you have any additional questions, please let me know. 

Regards,
Dess
Progress Telerik