Rotates a WPF DataGrid at design-time and run-time, including row-headers and row-details, using only XAML.

Also clears up text "smudging" that usually happens with rotating text.

Image of Rotated WPF DataGrid


How to Rotate a WPF DataGrid

Add the following sections to your DataGrid:
    <Style x:Key="DataGridBase" TargetType="Control">
        <Setter Property="LayoutTransform">
                    <RotateTransform Angle="-90" />
                    <ScaleTransform ScaleX="1" ScaleY="-1" />
        <Setter Property="TextOptions.TextFormattingMode" Value="Display" />
    </Style >
    <Style TargetType="DataGridCell" BasedOn="{StaticResource DataGridBase}"/>
    <Style TargetType="DataGridColumnHeader" BasedOn="{StaticResource DataGridBase}"/>
    <Style TargetType="DataGridRowHeader" BasedOn="{StaticResource DataGridBase}"/>
        <RotateTransform Angle="90" />
        <MatrixTransform Matrix="-1, 0, 0, 1, 0, 0" />

To rotate Row Details, apply the same LayoutTransform as the DataGrid:
                    <RotateTransform Angle="90" />
                    <MatrixTransform Matrix="-1, 0, 0, 1, 0, 0" />
            <TextBlock Height="100" Text="Binding Image" />

Note: Some CellStyle choices will prevent the DataGrid from rotating completely, so if your DataGrid does not display as illustrated above, please remove the misbehaving CellStyle settings.

Last edited Oct 12, 2012 at 12:25 AM by onejbsmith, version 12