列表框项目未填充屏幕WP7的整个宽度

Question

I am trying to create a listbox containing items with the following template

 <ListBox x:Name="moviesactedin" Style="{StaticResource ListBoxStyle2}">
       <ListBox.ItemTemplate>
            <DataTemplate>
                <Border BorderThickness="0,0,0,1" BorderBrush="Black" Margin="0,0,0,5">
                   <StackPanel Orientation="Horizontal" Margin="0,0,0,5" HorizontalAlignment="Stretch">
                         <Image Source="{Binding Image}" Stretch="None" Margin="0,0,5,5" />
                         <StackPanel Orientation="Vertical" Margin="10,0,0,0" VerticalAlignment="Top">
                        <TextBlock Text="{Binding Title}" Foreground="Black" FontWeight="Bold"/>
                        <TextBlock Text="{Binding Director}" Foreground="Black"/>
                        <TextBlock Text="{Binding ReleaseDate}" Foreground="Black"/>
                  </StackPanel>
                      <Image Source="/Images/icon_arrow.png" HorizontalAlignment="Right" VerticalAlignment="Center"/>
                   </StackPanel>

              </Border>
        </DataTemplate>
</ListBox.ItemTemplate>

and the listbox style

<Style x:Key="ListBoxStyle2" TargetType="ListBox">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="HorizontalAlignment" Value="Stretch" />
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="Template">
        <Setter.Value>
              <ControlTemplate TargetType="ListBox">
                        <ItemsPresenter  HorizontalAlignment="Stretch" 
                                            VerticalAlignment="Stretch"/>
               </ControlTemplate>
         </Setter.Value>
    </Setter>
</Style>

the first image will be at the left side, the stackPanel with three textblocks will be in the middle and the second image will be at the right hand side(at the end).

The problem is that the listbox item is not filling up the entire width of the screen so that i will have the last image to the end of the width of the screen.

Any help?

Answer 1

This worked

<ListBox.ItemContainerStyle>
         <Style TargetType="ListBoxItem">
               <Setter Property="Template">
                      <Setter.Value>
                           <ControlTemplate>
                                   <ContentPresenter
                                        HorizontalAlignment="Stretch" 
                                       VerticalAlignment="Stretch"
                                   />
                          </ControlTemplate>
                      </Setter.Value>
               </Setter>
           </Style>
</ListBox.ItemContainerStyle>

The items fills the entire length of the screen. Thanks Fabrice for the clue.

Answer 2

Can you try with that?

<Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/></Style>