StackPanel automatically stacks child controls on the left (Orientation="Horizontal") or top (Orientation="Vertical"). I've also noticed that the designer does not display the XAML code correcty (mine's not displaying an output at all, instead errors also because of the ResourceDictionaries).
If you want to achieve the expected output using the StackPanel, set the StackPanel's width, then set the child control's horizontal alignment to center.
Example:
Code: Select all
<StackPanel Width="200">
<Button Content="Hello" HorizontalAlignment="Center"/>
</StackPanel>
Or since setting the StackPanel's width is hassle and may not match the screen's width, you may use a Grid. (The grid automatically docks to the parent container and occupies the available space if you haven't set the width, height, horizontal and vertical alignments, and if you did not put the grid inside stackpanel or wrappanel)