如何使StackPanel或DockPanel拉伸以适应WPF中的容器？

Question

I have a Grid as a root container with two columns defined (There's only one row).
The first column has flexible width and second column has 300px fixed width.
Next, I have placed a ListBox inside the second column to stretch both horizontally and vertically, ie to fill the entire second column.
Lastly, I have defined an Items Template for the ListBox to be a vertically oriented StackPanel , with one DockPanel and a couple of TextBlock s inside.

<!-- Data template for ListBox -->
<DataTemplate DataType="{x:Type entities:Track}">
  <StackPanel Orientation="Vertical">
    <DockPanel>
      <TextBlock DockPanel.Dock="Left" Text="Now playing" />
      <TextBlock DockPanel.Dock="Right" Text="Time remaining" />
    </DockPanel>
    <TextBlock Text="{Binding Artist}" />
    <TextBlock Text="{Binding Title}" />
  </StackPanel>
</DataTemplate>

...

<ListBox 
  Grid.Column="1" 
  HorizontalAlignment="Stretch" 
  VerticalAlignment="Stretch" />

I have two questions:

1. How do I make the StackPanel fill the entire width of the ListBox ? Right now, it only takes enough space to accomodate the DockPanel and the TextBlock s inside. It won't fit the width of the ListBox or ListBoxItem .
2. Next, how do I make the DockPanel fill the entire width of the StackPanel , ie its parent? What happens right now is that even if the width of the TextBlock s in the StackPanel exceed the width of the DockPanel , it won't stretch to match their width.

Thanks for the help.

Answer 1

You can make the Content of every ListBoxItem stretch by setting HorizontalContentAlignment in the ItemContainerStyle

<ListBox ...>
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        </Style>
    </ListBox.ItemContainerStyle>