WPF: Drawing shapes in ListView

Question

I have a list of lines with attributes such as Brush, line thickness, etc. and I have a custom legend, which is a GridView in a ListView. What I want to accomplish is to draw the actual lines (with the Brush and thickness attributes) in the ListView to represent each line. Currently I have two columns, one for color and one for thickness. However, the color column is in hex, so it's not very useful.

Or, if it makes it simpler, it's enough to draw a square of the color under the color column instead of lines.

Any links or tutorials are appreciated. I am not familiar with drawing shapes/canvas/etc. in general, so I am a little lost.

Much appreciated!

Answer 1

I would use a Rectangle to draw the line and bind the Height to the thickness value and the Fill to the color value. Use the CellTemplate and set it to one of the following in the GridViewColumn .

<DataTemplate x:Key="ThicknessTemplate">
  <Rectangle Height="{Binding LineThickness}" Width="10" Fill="{Binding LineColor}"/>
<DataTemplate/>
<DataTemplate x:Key="ColorTemplate">
  <Rectangle Height="10" Width="10" Fill="{Binding LineColor}"/>
<DataTemplate/>

Answer 2

Here is a couple of links

• Drawing shapes on a control
• Drawing shapes on a listview
• Working with a listview in WPF