Home Forums WPF controls Xceed DataGrid for WPF Adding an "Icon column"

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • User (Old forums)
    Member
    Post count: 23064
    #23728 |

    I have the requirement to be able to present collectins of different types of objects within the same grid. I’ll be defining the columns in code based on the type of object(s) that are specified. An additional requirement is to be able to display a column that contains an icon that represents the object type.

    Is there a way to do this without embedding the actual image in the collection as a field? If so, how would I accomplish this?

    If not, how would I display an “icon column” based on a field in the collection

    Imported from legacy forums. Posted by Lori (had 868 views)

    Xceed Support
    Member
    Post count: 5658

    If you already know what are the different type of objects, you could have the icons in the resources and by specifying a CellContentTemplate (DataTemplate) that contain the appropriate triggers, you could select what icon to display based on the object type…

    For this, you need to create a column with the appropriate field name, and then assign its CellContentTemplate to the template as described above.

    Imported from legacy forums. Posted by Marcus [Xceed] (had 355 views)

    User (Old forums)
    Member
    Post count: 23064

    Hi Marcus,

    Thanks for the info. Could you expand a little bit on the use of the triggers? I need to select an icon based on the object type of each row in the grid. I get the icon by passing a string to a method which returns an “ImageSource”, which I assign to the Source property of an Image.

    Imported from legacy forums. Posted by Lori (had 3082 views)

    User (Old forums)
    Member
    Post count: 23064

    I am attempting to do this also, but am not having much luck.  In particular, I wish to embed my icon within the same cell as one of my data items using a CellContentTemplate.

    I have attached a dummy project of my attempt to do this, but I am having two problems:

    • The TextBlock.Text Binding to a Column in my DataTable property to which the DataGrid is bound to doesn’t seem to be working.  I have replicated the code as in the Table View example in Xceed Samples (as per employeeDataTemplate in EmployeeTemplates.xaml), but I’m not getting the same result.
    • The DataTrigger.Setters that are bound to a Column in my DataTable are not working – not displaying any image dependent on the Path and Value of the Binding.

    Any help that could be given regarding this would be most appreciated.

    Many thanks,

    Jason

    Imported from legacy forums. Posted by Neo (had 270 views)

    User (Old forums)
    Member
    Post count: 23064

    Still looking for some support on this, any ideas on how to resolve this please?

    Thanks,

    Jason

    Imported from legacy forums. Posted by Neo (had 266 views)

    Xceed Support
    Member
    Post count: 5658

    Hi Jason,

    The solution is to properly implement the Binding to the underlying business object as follow:

    <DataTemplate x:Key=”myDataTemplate”>

            <DockPanel>

              <Image x:Name=”myIcon”

                     Height=”20″

                     VerticalAlignment=”Top”

                     Margin=”1″

                     DockPanel.Dock=”Left” />

     

             <TextBlock Text=”{Binding}”/>

            </DockPanel>

     

            <DataTemplate.Triggers>

              <DataTrigger Binding=”{Binding Path=DataContext[Column2],RelativeSource={RelativeSource AncestorType=xcdg:DataCell}}” Value=”Cat”>

                <DataTrigger.Setters>

                  <Setter TargetName=”myIcon” Property=”Source” Value=”Cat.png” />

                </DataTrigger.Setters>

              </DataTrigger>

              <DataTrigger Binding=”{Binding Path=DataContext[Column2],RelativeSource={RelativeSource AncestorType=xcdg:DataCell}}” Value=”Dog”>

                <DataTrigger.Setters>

                  <Setter TargetName=”myIcon” Property=”Source” Value=”Dog.png” />

                </DataTrigger.Setters>

              </DataTrigger>

            </DataTemplate.Triggers>

     

          </DataTemplate>

          </DataTemplate>

    Find attached the updated project.

     

    Imported from legacy forums. Posted by Mohamed [Xceed] (had 162 views)

    User (Old forums)
    Member
    Post count: 23064

    Excellent, that worked perfectly!  Thank you!

    Imported from legacy forums. Posted by Neo (had 862 views)

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.