C# Windows Phone -Alignment w Xaml ListBox.ItemTemplate

Question

Chciałbym zrobić prosty ListBox. Każda linia powinna zawierać 2 kontrolki, jedna wyrównana w lewo, druga po prawej, to wszystko :) Próbowałem wielu podejść, ale nic nie działało. Mój kod jest następujący

<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> 

(Dwa TextBlocks są tylko dla demonstracji w rzeczywistej aplikacji chciałbym związać jeden blok tekstu do rzeczywistych danych, zamiast drugiego przycisku złego użytkowania.) Kiedy chory skompilować to zarówno textblock są wyrównane w lewo, w emulatorze wygląda na jeden blok tekstu z tekstem "abcdef". Dowolny pomysł, jak wyrównać jeden blok tekstu w prawo, a drugi w lewo? bardzo dziękuję :)

Answer 1

Domyślnie obiekt ListBoxItem nie wypełnia podanej przestrzeni. Wyrównuje się i treść w lewo. Aby upewnić się, że zawartość swojej ListBoxItem rozciąga się na całą szerokość, trzeba zmienić ItemContainerStyle

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

Teraz zawartość obejmie dostępną szerokość. Jeśli chcesz użyć StackPanel jak w twoim przykładzie, upewnij się, że ustawiłeś także HorizontalAlignment. StackPanel też nie wypełnić dostępną przestrzeń danego

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

Jednakże, polecam za pomocą siatki i definiowanie dwóch kolumn

<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>