Best Practice Method for Including Images in a DataGrid using MVVM

Posted by Killercam on Programmers See other posts from Programmers or by Killercam
Published on 2014-06-04T10:50:20Z Indexed on 2014/06/04 15:42 UTC
Read the original article Hit count: 207

Filed under:
|

All, I have a WPF DataGrid. This DataGrid shows files ready for compilation and should also show the progress of my compiler as it compiles the files. The format of the DataGrid is

Image|File Path|State
-----|---------|-----   
*    |C:\AA\BB |Compiled
&    |F:PP\QQ  |Failed
>    |G:HH\LL  |Processing
....

The problem is the image column (the *, &, and > are for representation only). I have a ResourceDictionary that contains hundreds of vector images as Canvas objects:

<ResourceDictionary xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<Canvas x:Key="appbar_acorn" Width="48" Height="48" Clip="F1 M 0,0L 48,0L 48,48L 0,48L 0,0">
    <Path Width="22.3248" Height="25.8518" Canvas.Left="13.6757" Canvas.Top="11.4012" Stretch="Fill" Fill="{DynamicResource BlackBrush}" Data="F1 M 16.6309,18.6563C 17.1309,8.15625 29.8809,14.1563 29.8809,14.1563C 30.8809,11.1563 34.1308,11.4063 34.1308,11.4063C 33.5,12 34.6309,13.1563 34.6309,13.1563C 32.1309,13.1562 31.1309,14.9062 31.1309,14.9062C 41.1309,23.9062 32.6309,27.9063 32.6309,27.9062C 24.6309,24.9063 21.1309,22.1562 16.6309,18.6563 Z M 16.6309,19.9063C 21.6309,24.1563 25.1309,26.1562 31.6309,28.6562C 31.6309,28.6562 26.3809,39.1562 18.3809,36.1563C 18.3809,36.1563 18,38 16.3809,36.9063C 15,36 16.3809,34.9063 16.3809,34.9063C 16.3809,34.9063 10.1309,30.9062 16.6309,19.9063 Z "/>
</Canvas>
</ResourceDictionary>

Now, I want to be able to include these in my image column and change them at run-time. I was going to attempt to do this by setting up a property in my View Model that was of type Image and binding this to my View via:

<DataGrid.Columns>
    <DataGridTemplateColumn Header="" 
                            Width="SizeToCells" 
                            IsReadOnly="True">
        <DataGridTemplateColumn.CellTemplate>
            <DataTemplate>
                <Image Source="{Binding Canvas}"/>
            </DataTemplate>
        </DataGridTemplateColumn.CellTemplate>
    </DataGridTemplateColumn>
</DataGrid.Columns>

Where in the View Model I have the appropriate property. Now, I was told this is not 'pure' MVVM. I don't fully accept this, but I want to know if there is a better way of doing this. Say, binding to an enum and using a converter to get the image?

Any advice would be appreciated.

© Programmers or respective owner

Related posts about c#

Related posts about mvvm