WPF - Can't align Groupbox Header to right - wpf

Question

I'm new to WPF,
I can't align the groupbox header text "abc" to the right,it's stays on the left, don't know why, can anyone help me please?
<Window x:Class="UserInterface.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="500" Width="625">
<Grid ShowGridLines="True">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" ShowGridLines="True">
<Grid.RowDefinitions>
<RowDefinition Height="4*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="1">
<GroupBox>
<GroupBox.Header>
<DockPanel>
<TextBlock HorizontalAlignment="Right">abc</TextBlock>
</DockPanel>
</GroupBox.Header>
</GroupBox>
</StackPanel>
</Grid>
</Grid>
</Window>

Answer 1

You have to override Template of Groupbox in case you want to align header to Right. By default it is placed at left in default template.
Key is to
Set Grid.ColumnSpan to 2 on border hosting Header ContentPresenter.
Set HorizontalAlignment to Right on ContentPresenter.
Here is the XAML which will work:
<GroupBox Header="abc">
<GroupBox.Template>
<ControlTemplate TargetType="GroupBox">
<Grid SnapsToDevicePixels="True">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="6" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="6" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="6" />
</Grid.RowDefinitions>
<Border BorderThickness="{TemplateBinding Border.BorderThickness}"
CornerRadius="4,4,4,4"
BorderBrush="#00FFFFFF"
Background="{TemplateBinding Panel.Background}"
Grid.Column="0"
Grid.Row="1"
Grid.ColumnSpan="4"
Grid.RowSpan="3" />
<Border BorderThickness="{TemplateBinding Border.BorderThickness}"
CornerRadius="4,4,4,4"
BorderBrush="#FFFFFFFF"
OpacityMask="{x:Null}"
Grid.Row="1"
Grid.ColumnSpan="4"
Grid.RowSpan="3">
<Border BorderThickness="{TemplateBinding Border.BorderThickness}"
CornerRadius="3,3,3,3"
BorderBrush="{TemplateBinding Border.BorderBrush}">
<Border BorderThickness="{TemplateBinding Border.BorderThickness}"
CornerRadius="2,2,2,2"
BorderBrush="#FFFFFFFF" />
</Border>
</Border>
<Border Padding="3,1,3,0"
Name="Header"
Grid.Column="1"
Grid.ColumnSpan="2" <-- HERE
Grid.Row="0"
Grid.RowSpan="2">
<ContentPresenter RecognizesAccessKey="True"
HorizontalAlignment="Right" <-- And HERE
Content="{TemplateBinding HeaderedContentControl.Header}"
ContentTemplate="{TemplateBinding HeaderedContentControl.HeaderTemplate}"
ContentStringFormat="{TemplateBinding HeaderedContentControl.HeaderStringFormat}"
ContentSource="Header"
SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" />
</Border>
<ContentPresenter Content="{TemplateBinding ContentControl.Content}"
ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}"
ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}"
Margin="{TemplateBinding Control.Padding}"
SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}"
Grid.Column="1"
Grid.Row="2"
Grid.ColumnSpan="2" />
</Grid>
</ControlTemplate>
</GroupBox.Template>
</GroupBox>

Answer 2

You need to redesign the ContentPresenter inside the template of the Control.
MSDN has an example but somehow it also redesigns the GroupBox.
Check this out and see if thats what you are looking for. You are looking for this line
<ContentPresenter Margin="4"
ContentSource="Header"
RecognizesAccessKey="True" />
Just add to that:
HorizontalAlignment="Right"