C# windows phone -Alineación en xaml ListBox.ItemTemplate

Question

Me gustaría hacer ListBox simple. Cada línea debe contener 2 controles, uno alineado a la izquierda y el otro a la derecha, eso es todo :) Intenté varios enfoques pero nada funcionó. Mi código está siguiendo

<StackPanel Grid.Row="1" Margin="12,0,12,0" Grid.Column="0"> 
     <ListBox Name="ListBox" Margin="12,0,12,0" ItemsSource="Exercises" HorizontalContentAlignment="Stretch"> 
      <ListBox.ItemTemplate> 
       <DataTemplate> 
        <StackPanel Orientation="Horizontal" Width="> 
         <TextBlock Text="abc" HorizontalAlignment="Left" VerticalAlignment="Center"/> 
         <TextBlock Text="def" HorizontalAlignment="Right" VerticalAlignment="Center"/> 
        </StackPanel> 
       </DataTemplate> 
      </ListBox.ItemTemplate> 
     </ListBox> 
    </StackPanel> 

(Dos bloques de texto son sólo para demostración, en aplicación real que me gustaría unirse a una cuadra de texto con los datos reales, en lugar de usar mal segundo botón.) Cuando enferma compilar este, tanto textblock están alineados a la izquierda, en el emulador, parece un bloque de texto con el texto "abcdef". ¿Alguna idea de cómo alinear un bloque de texto a la derecha y el otro a la izquierda? muchas gracias :)

Answer 1

Por defecto, ListBoxItem no llena el espacio que se le da. Se alinea a sí mismo y el contenido a la izquierda. Para asegurar que el contenido de su ListBoxItem se extiende por todo el ancho, es necesario cambiar el ItemContainerStyle

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

Ahora el contenido abarcará la anchura disponible. Si desea utilizar un StackPanel como en su ejemplo, asegúrese de configurar su Alineación Horizontal también. El StackPanel también no rellena el espacio disponible dada

<DataTemplate> 
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch"> 
     <TextBlock Text="abc" HorizontalAlignment="Left" VerticalAlignment="Center"/> 
     <TextBlock Text="def" HorizontalAlignment="Right" VerticalAlignment="Center"/> 
    </StackPanel> 
</DataTemplate> 

Sin embargo, yo recomendaría usar una cuadrícula y definir dos columnas

<DataTemplate> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" /> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 
     <TextBlock Text="abc" HorizontalAlignment="Left" VerticalAlignment="Center"/> 
     <TextBlock Text="def" Grid.Column="1" HorizontalAlignment="Right" VerticalAlignment="Center"/> 
    </Grid> 
</DataTemplate>