ControlRowHeader with Image

Mar 18, 2009 at 5:41 AM
I want to show different images at the RowHeader of each row in DataGrid according to bind property. And I don't know how to write the style for the ControlRowHeader, any snippet code can help me?

Thanks

 

Mar 18, 2009 at 8:29 AM
Edited Mar 18, 2009 at 8:31 AM
The Header property is of type object, so you can assign anything you want to it. I just tried setting it to an image I had handy in my project, and it works fine. The "nstk" namespace contains a control derived from the WPF Toolkit DataGrid, but it does not touch the Header property so that is fully inherited from the base control which is the official codebase.

<nstk:DataGridTextColumn Binding="{Binding}">
    <nstk:DataGridTextColumn.Header>
        <Image Source="/Images/ToolbarButtons/home.gif" />
    </nstk:DataGridTextColumn.Header>
</nstk:DataGridTextColumn>

Hope this helps.

Oops... I just re-read your post and realized I misread your question. Maybe the above will help anyway, maybe not. I'm leaving it in just in case.
Coordinator
Mar 18, 2009 at 8:18 PM
Here is a sample style that should show how to put an image in the RowHeader that is databound to the Item.

     <Style x:Key="rowHeaderStyle" TargetType="{x:Type DataGridRowHeader}">
        <Setter Property="Template">
            <Setter.Value>
                <ContrtolTemplate>
                    <Image Source="{Binding ImagePropertyOnDataObject}" />
                    </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Mar 19, 2009 at 1:57 AM
Edited Mar 19, 2009 at 2:07 AM
Thanks very much for all your reply!

Sorry I tried the code and but it doesn't show the image just be blank at the RowHeader

do I miss something?

And I want to clarify what I want is RowHeader keep the button style with the image show on it? I think if we redefine the Template, the button style will go away. So I guess maybe I need use content template, but I don't know how to do it. So wish your help.

        <Style x:Key="ControlRowHeaders" TargetType="{x:Type dg:DataGridRowHeader}">
            <!--<Setter Property="Content" Value="Resources\folder.ico"/>-->
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Image Name="img" Source="Resources\folder.ico" Width="16" Height="16"/>
                     </ControlTemplate>
                </Setter.Value>
            </Setter>
          </Style>
Mar 19, 2009 at 9:55 AM
Seems to me like just a typo. Replace the <ContrtolTemplate> opening tag in the XAML above with the correctly spelled <ControlTemplate>, and see if that helps.
Mar 19, 2009 at 2:13 PM
Edited Mar 19, 2009 at 3:47 PM
Thanks. Actually I already fix the typo error, so it can pass build, but it still has no effect just show nothing at the RowHeader.
Apr 8, 2009 at 2:21 AM
I try to set image at header by its content, the code as following:
      <dg:DataGrid.RowHeaderStyle>
        <Style TargetType="{x:Type dg:DataGridRowHeader}">
            <Setter Property="Content">
                <Setter.Value>
                    <Image Name="img" Source="help.ico" Width="16" Height="16"/>
                </Setter.Value>
            </Setter>
        </Style>
      </dg:DataGrid.RowHeaderStyle>

It throw exception and told me: Cannot add content of type 'System.Windows.Controls.Image' to an object of type 'System.Object'.

What should I do? Thanks very much.

The original way is OK:
      <dg:DataGrid.RowHeaderStyle>
        <Style TargetType="{x:Type dg:DataGridRowHeader}">
          <Setter Property="Content" Value="{Binding Id}"/>
        </Style>
      </dg:DataGrid.RowHeaderStyle>