WP7 ListBox Elementos para llenar el ancho de ListBox

Question

Estoy tratando de obtener los elementos en un ListBox para abarcar todo el ancho del ListBox. He encontrado varias publicaciones relacionadas con HorizontalContentAlignment = "Stretch" pero no he podido hacer que funcionen en mi aplicación WP7. Aquí está mi cuadro de lista:

<ListBox Margin="8" HorizontalContentAlignment="Stretch" ItemsSource="{Binding Collection}" > 
    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <Border BorderBrush="Black" CornerRadius="3" Background="#FFE88D34" 
       BorderThickness="1" HorizontalAlignment="Stretch" > 
       <Grid Background="Transparent" HorizontalAlignment="Stretch" > 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="*" /> 
        </Grid.ColumnDefinitions> 
        <TextBlock 
         Grid.Column="0" HorizontalAlignment="Stretch" 
         Margin="2"          
         FontSize="10" 
         Text="{Binding Property1}"/> 
       </Grid> 
      </Border> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
    <ListBox.ItemContainerStyle> 
     <Style TargetType="ListBoxItem"> 
      <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
     </Style> 
    </ListBox.ItemContainerStyle> 
</ListBox> 

que estoy tratando de conseguir el borde naranja para abarcar todo el ancho del cuadro de lista para que todos los elementos de la lista son del mismo tamaño y no sólo el tamaño del texto en el TextBlock.

Answer 1

Creo que esto es un error en la versión beta, porque debería ser HorizontalContentAlignment.

como solución alternativa puede que tenga que usar un valor de ancho fijo.

Answer 2

Parece que John Gardner está a punto de que esto es un defecto en la versión Beta. Funciona bien en Silverlight "antiguo", pero cede áreas extrañamente centradas en el teléfono. Sin embargo, es bastante fácil pasar de largo.

• Deshazte de/comenta la entrada ListBox.ItemContainerStyle en tu listbox, arriba.

• En Blend, seleccione su ListBox en el panel Objetos y escala de tiempo, haga clic derecho y seleccione Editar plantillas adicionales/Editar contenedor de elementos generados (ItemContainerStyle)/Editar una copia ... Elija un nombre/clave y ubicación para el nuevo recurso de estilo.

• Localizar el control ContentContainer y establezca su alineación contenido Horizontal para unirse a la alineación contenido Horizontal definido en el elemento de consumir esta plantilla, (HorizontalContentAlignment = "{TemplateBinding HorizontalContentAlignment}") como sigue:

  <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
  

Una vez que le haya dicho al ContentControl cómo debe alinear su contenido (ejem), los resultados deberían ser los que esperaba.

Answer 3

Use el siguiente recurso estático como ItemContainerStyle del cuadro de lista:

ItemContainerStyle="{StaticResource ListboxStretchStyle}" 

<Application.Resources> 
    <Style TargetType="ListBoxItem" x:Key="ListboxStretchStyle"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <ContentPresenter HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Application.Resources> 

Answer 4

Esto es lo que yo utilizo para ello:

   <ListBox Height="430" Margin="50,70,50,110" Name="myListBox" > 

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

        <ListBox.ItemTemplate> 
         <DataTemplate> 
          <Border Background="{StaticResource PhoneAccentBrush}" > 
           <TextBlock 
            Text="{Binding Text}" 
            FontSize="30" 
            Foreground="{StaticResource PhoneForegroundBrush}" /> 
          </Border> 
         </DataTemplate> 
        </ListBox.ItemTemplate> 

       </ListBox> 

mineral de más menos que se encuentran aquí: http://timdams.wordpress.com/2011/11/30/creating-a-wp7-app-listbox-items-of-the-same-width/