Comment : aligner horizontalement ou verticalement le contenu dans un StackPanel
Mise à jour : novembre 2007
Cet exemple montre comment ajuster l'Orientation du contenu dans un élément StackPanel et comment ajuster le HorizontalAlignment et le VerticalAlignment du contenu enfant.
Exemple
L'exemple suivant crée trois éléments ListBox en XAML (Extensible Application Markup Language). Chaque ListBox représente les valeurs possibles des propriétés Orientation, HorizontalAlignment et VerticalAlignment d'un StackPanel. Lorsqu'un utilisateur sélectionne une valeur dans l'un des éléments ListBox, la propriété associée du StackPanel et ses éléments Button enfants sont modifiés.
<ListBox VerticalAlignment="Top" SelectionChanged="changeOrientation" Grid.Row="2" Grid.Column="1" Width="100" Height="50" Margin="0,0,0,10">
<ListBoxItem>Horizontal</ListBoxItem>
<ListBoxItem>Vertical</ListBoxItem>
</ListBox>
<ListBox VerticalAlignment="Top" SelectionChanged="changeHorAlign" Grid.Row="2" Grid.Column="3" Width="100" Height="50" Margin="0,0,0,10">
<ListBoxItem>Left</ListBoxItem>
<ListBoxItem>Right</ListBoxItem>
<ListBoxItem>Center</ListBoxItem>
<ListBoxItem>Stretch</ListBoxItem>
</ListBox>
<ListBox VerticalAlignment="Top" SelectionChanged="changeVertAlign" Grid.Row="2" Grid.Column="5" Width="100" Height="50" Margin="0,0,0,10">
<ListBoxItem>Top</ListBoxItem>
<ListBoxItem>Bottom</ListBoxItem>
<ListBoxItem>Center</ListBoxItem>
<ListBoxItem>Stretch</ListBoxItem>
</ListBox>
<StackPanel Grid.ColumnSpan="6" Grid.Row="3" Name="sp1" Background="Yellow">
<Button>Button One</Button>
<Button>Button Two</Button>
<Button>Button Three</Button>
<Button>Button Four</Button>
<Button>Button Five</Button>
<Button>Button Six</Button>
</StackPanel>
Le fichier code-behind suivant définit les modifications des événements associés aux modifications de sélection ListBox. Le StackPanel est identifié par le Name sp1.
Private Sub changeOrientation(ByVal sender As Object, ByVal args As SelectionChangedEventArgs)
Dim li As ListBoxItem = CType(CType(sender, ListBox).SelectedItem, ListBoxItem)
If (li.Content.ToString() = "Horizontal") Then
sp1.Orientation = System.Windows.Controls.Orientation.Horizontal
ElseIf li.Content.ToString() = "Vertical" Then
sp1.Orientation = System.Windows.Controls.Orientation.Vertical
End If
End Sub
Private Sub changeHorAlign(ByVal sender As Object, ByVal args As SelectionChangedEventArgs)
Dim li As ListBoxItem = CType(CType(sender, ListBox).SelectedItem, ListBoxItem)
If (li.Content.ToString() = "Left") Then
sp1.HorizontalAlignment = System.Windows.HorizontalAlignment.Left
ElseIf (li.Content.ToString() = "Right") Then
sp1.HorizontalAlignment = System.Windows.HorizontalAlignment.Right
ElseIf (li.Content.ToString() = "Center") Then
sp1.HorizontalAlignment = System.Windows.HorizontalAlignment.Center
ElseIf (li.Content.ToString() = "Stretch") Then
sp1.HorizontalAlignment = System.Windows.HorizontalAlignment.Stretch
End If
End Sub
Private Sub changeVertAlign(ByVal sender As Object, ByVal args As SelectionChangedEventArgs)
Dim li As ListBoxItem = CType(CType(sender, ListBox).SelectedItem, ListBoxItem)
If (li.Content.ToString() = "Top") Then
sp1.VerticalAlignment = System.Windows.VerticalAlignment.Top
ElseIf (li.Content.ToString() = "Bottom") Then
sp1.VerticalAlignment = System.Windows.VerticalAlignment.Bottom
ElseIf (li.Content.ToString() = "Center") Then
sp1.VerticalAlignment = System.Windows.VerticalAlignment.Center
ElseIf (li.Content.ToString() = "Stretch") Then
sp1.VerticalAlignment = System.Windows.VerticalAlignment.Stretch
End If
End Sub
private void changeOrientation(object sender, SelectionChangedEventArgs args)
{
ListBoxItem li = ((sender as ListBox).SelectedItem as ListBoxItem);
if (li.Content.ToString() == "Horizontal")
{
sp1.Orientation = System.Windows.Controls.Orientation.Horizontal;
}
else if (li.Content.ToString() == "Vertical")
{
sp1.Orientation = System.Windows.Controls.Orientation.Vertical;
}
}
private void changeHorAlign(object sender, SelectionChangedEventArgs args)
{
ListBoxItem li = ((sender as ListBox).SelectedItem as ListBoxItem);
if (li.Content.ToString() == "Left")
{
sp1.HorizontalAlignment = System.Windows.HorizontalAlignment.Left;
}
else if (li.Content.ToString() == "Right")
{
sp1.HorizontalAlignment = System.Windows.HorizontalAlignment.Right;
}
else if (li.Content.ToString() == "Center")
{
sp1.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
}
else if (li.Content.ToString() == "Stretch")
{
sp1.HorizontalAlignment = System.Windows.HorizontalAlignment.Stretch;
}
}
private void changeVertAlign(object sender, SelectionChangedEventArgs args)
{
ListBoxItem li = ((sender as ListBox).SelectedItem as ListBoxItem);
if (li.Content.ToString() == "Top")
{
sp1.VerticalAlignment = System.Windows.VerticalAlignment.Top;
}
else if (li.Content.ToString() == "Bottom")
{
sp1.VerticalAlignment = System.Windows.VerticalAlignment.Bottom;
}
else if (li.Content.ToString() == "Center")
{
sp1.VerticalAlignment = System.Windows.VerticalAlignment.Center;
}
else if (li.Content.ToString() == "Stretch")
{
sp1.VerticalAlignment = System.Windows.VerticalAlignment.Stretch;
}
}
Pour l'exemple complet, consultez Positionnement StackPanel, exemple.