Cómo: Alinear horizontal o verticalmente el contenido de un elemento StackPanel

En este ejemplo se muestra cómo ajustar la propiedad Orientation del contenido de un elemento StackPanel y también cómo ajustar las propiedades HorizontalAlignment y VerticalAlignment de contenido secundario.

Ejemplo

En el ejemplo siguiente se crean tres elementos ListBox en Extensible Application Markup Language (XAML). Cada ListBox representa los valores posibles de las propiedades Orientation, HorizontalAlignment y VerticalAlignment de un elemento StackPanel. Cuando un usuario selecciona un valor en alguno de los elementos ListBox, cambia la propiedad asociada de StackPanel y sus elementos Button secundarios.

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

El archivo de código subyacente siguiente define los cambios que se producen en los eventos asociados a los cambios de selección de ListBox. StackPanel se identifica mediante 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;
            }
        }

Vea también

Referencia

StackPanel

ListBox

HorizontalAlignment

VerticalAlignment

Conceptos

Información general sobre elementos Panel