如何为ItemsControl中的每个项目显示某个路径？

Question

So I have an ItemsControl, and for each item I would like to render a System.Windows.Shapes.Path to indicate the item's status. Each status should use a different color for the Path.

What I'm currently doing (which works, but is a horrible solution), is adding a property for each status to the view model, for example, ShowIconA , ShowIconB , ShowIconC , and a Path for each status to the data template:

<DataTemplate>
    <Path Fill="Red" Visibility="{Binding ShowIconA, Converter={StaticResource BoolVisConv}}" Data="..." />
    <Path Fill="Green" Visibility="{Binding ShowIconB, Converter={StaticResource BoolVisConv}}" Data="..." />
    <Path Fill="Blue" Visibility="{Binding ShowIconC, Converter={StaticResource BoolVisConv}}" Data="..." />
    ...
</DataTemplate>

What's a better way to handle this? I'd like to just have a status enum and then look up a Path or something in a dictionary, and I'd also like to avoid building the Path through code.

Another thought I had was to use a converter like the following, and then I could bind an Image's Source property to the status property. The problem with this approach was that I couldn't find a good way to size the paths. I would need to either calculate the appropriate relative scaling transform for each one, or set the dimensions on the image itself, which would just do bitmap scaling.

<conv:DictionaryConverter x:Key="StatusIcons">
    <DrawingImage x:Key="Status1">
        <DrawingImage.Drawing>
            <GeometryDrawing Brush="Red" Geometry="...">
        </DrawingImage.Drawing>
    </DrawingImage>
    <DrawingImage x:Key="Status2">
        <DrawingImage.Drawing>
            <GeometryDrawing Brush="Green" Geometry="...">
        </DrawingImage.Drawing>
    </DrawingImage>
</conv:DictionaryConverter>

I also tried putting Paths into a converter like the above and then binding a ContentControl in the DataTemplate, but that seems to cause issues since there's only one Path instance for each status, and I'm trying to use them in multiple places?

I suppose I could have one dictionary of strings for the path data, and another for the colors, and a converter for each, but that still doesn't seem great.

Any thoughts?

Answer 1

You can implement is like below...

<conv:StatusFillConverter x:Key="statusFillConverter"></conv:StatusFillConverter>
<conv:StatusDataConverter x:Key="statusDataConverter"></conv:StatusDataConverter >

<Path Fill="{Binding Status, Converter={StaticResource statusFillConverter}}" Data="{Binding Status, Converter={StaticResource statusDataConverter}}"></Path>

Answer 2

How about using a single property on your viewmodel to indicate which path you want to draw?

The trick here is that instead of making it an enum, you make it a class, so;

public class MyViewModel
{
   public object PathType; //or you could have a base class/interface
  ...
}

public class Status1Path
{
   // Don't need an implementation, just its type
}

public class Status2Path
{
   // Don't need an implementation, just its type
}

Now all you do is use a DataTemplate for each class to draw the different imagery

<DataTemplate DataType="{x:Type Status1Path}">
  <Path Fill="Red" Data="..." />
</DataTemplate>    

<DataTemplate DataType="{x:Type Status2Path}">
  <Path Fill="Green" Data="..." />
</DataTemplate>