Dividing Lines in UI for WinForms

This is a migrated thread and some comments may be shown as answers.

Dividing Lines

1 Answer 42 Views

ListView

This is a migrated thread and some comments may be shown as answers.

Sheldon asked on 18 Jan 2013, 05:29 PM

Hello,

I am using RadListView that will display an image for each data record. There will be 4 records in a row with an undetermined number of rows that will depend on the pager. To the right of the image I would like to add a dividing line, but I do not want the line to appear for the 4th record in each row. I would also like a horizontal line between the rows. In other words I would like it to display

image | image | image | image
_________________________

image | image | image | image

Currently I have my item template defined as a table and have set the right border to display, so it displays the "line" for each record including after the 4th image. Can anyone tell me how I can do this with the RadListView, or do I need to use a different control?

Thanks.

1 Answer, 1 is accepted

answered on 23 Jan 2013, 06:29 AM

Hi Sheldon,

Thank you for writing.

You can do this by handling the CellFormatting event. You can use HeaderText property to identify whether the processed cell belongs to the last column and the row index to determine whether this is the last row. Consider the sample below:

void radListView1_CellFormatting(object sender, ListViewCellFormattingEventArgs e)

{

if (e.CellElement.VisualState.Contains("DetailListViewHeaderCellElement"))

{

e.CellElement.ResetValue(LightVisualElement.DrawBorderProperty, ValueResetFlags.Local);

e.CellElement.ResetValue(LightVisualElement.BorderBoxStyleProperty, ValueResetFlags.Local);

e.CellElement.ResetValue(LightVisualElement.BorderLeftWidthProperty, ValueResetFlags.Local);

e.CellElement.ResetValue(LightVisualElement.BorderRightWidthProperty, ValueResetFlags.Local);

e.CellElement.ResetValue(LightVisualElement.BorderTopWidthProperty, ValueResetFlags.Local);

e.CellElement.ResetValue(LightVisualElement.BorderBottomWidthProperty, ValueResetFlags.Local);

e.CellElement.ResetValue(LightVisualElement.BorderRightColorProperty, ValueResetFlags.Local);

e.CellElement.ResetValue(LightVisualElement.BorderBottomColorProperty, ValueResetFlags.Local);

}

else

{

if (e.CellElement.Data.HeaderText == "Column 3")

{

e.CellElement.DrawBorder = true;

e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;

e.CellElement.BorderLeftWidth = 0;

e.CellElement.BorderTopWidth = 0;

e.CellElement.BorderBottomWidth = 1;

e.CellElement.BorderRightWidth = 0;

e.CellElement.BorderRightColor = Color.Gray;

}

else

{

e.CellElement.DrawBorder = true;

e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;

e.CellElement.BorderLeftWidth = 0;

e.CellElement.BorderTopWidth = 0;

e.CellElement.BorderBottomWidth = 1;

e.CellElement.BorderRightWidth = 1;

e.CellElement.BorderBottomColor = Color.Gray;

e.CellElement.BorderRightColor = Color.Gray;

}

DetailListViewDataCellElement detailCell = e.CellElement as DetailListViewDataCellElement;

if (detailCell != null && this.radListView1.Items.IndexOf(detailCell.Row) == this.radListView1.Items.Count - 1)

{

e.CellElement.BorderBottomWidth = 0;

}

I hope it helps.

Kind regards,
Jack
the Telerik team

Q3'12 SP1 of RadControls for WinForms is out now. See what's new.