Search code examples
wpfsilverlightxamldatagridsortdirection

DataGrid header sort direction icon


How can i display custom sort direction image in wpf datagrid header?

I use this style in my datagrid. How can I add images for ascending and descending sort directions?

<Style x:Key="DataGridColumnHeaderStyle" TargetType="{x:Type DataGridColumnHeader}"  >
        <Setter Property="Background">
            <Setter.Value>
                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                    <GradientStop Color="#fbfdfc" Offset="0.1" />
                    <GradientStop Color="#d4d5d9" Offset="0.9" />
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="Foreground" Value="Black" />
        <Setter Property="Padding" Value="3"/>
        <Style.Triggers>
            <MultiTrigger>
                <MultiTrigger.Conditions>
                    <Condition Property="IsMouseOver" Value="True" />
                    <Condition Property="SortDirection" Value="{x:Null}" />
                </MultiTrigger.Conditions>
                <Setter Property="Background">
                    <Setter.Value>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                            <GradientStop Color="#ffd8a8" Offset="0.0" />
                            <GradientStop Color="#ffad41" Offset="0.5" />
                            <GradientStop Color="#fedf78" Offset="0.9" />
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
                <Setter Property="BorderBrush" Value="Black" />
            </MultiTrigger>
        </Style.Triggers>
    </Style>

Solution

  • If you want to change the triangles you need to override the Template, you can trigger on the SortDirection and display a different image accordingly. (Get the default templates from MSDN (Default WPF Themes link))