Fill StackPanel inside DockPanel

Question

This should be easy: how can I stretch StackPanel inside the DockPanel, so that it would fill the whole parent's content and also maintain it's HorizontalAlignment?

Example:

<DockPanel LastChildFill="True">
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Background="Yellow">
        <Button Height="30">Button1</Button>
        <Button Height="30">Button2</Button>
    </StackPanel>
</DockPanel>

In this example the StackPanel's width is the same as the combined width from both buttons (and the background here is yellow), but the remaining space in DockPanel stays white. Looks like the LastChildFille property isn't working in my example.

Answer 1

I think by setting HorizontalAligment to Center on the StackPanel you are overriding the behavior of the DockPanel to fill the whole space with the StackPanel.

When i understand your question right, you want that the full space is yellow and the stackpanel with buttons is centered in the middle. Then you should wrap the StackPanel inside a Grid.

<DockPanel LastChildFill="True">
  <Grid Background="Yellow">
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
      <Button Height="30">Button1</Button>
      <Button Height="30">Button2</Button>
    </StackPanel>
  </Grid>
</DockPanel>