方法 : StackPanel にコンテンツを水平方向または垂直方向に配置する

更新 : 2007 年 11 月

この例では、StackPanel 要素内のコンテンツの Orientation を調整する方法、および子コンテンツの HorizontalAlignment と VerticalAlignment を調整する方法を示します。

使用例

次の例では、Extensible Application Markup Language (XAML) で、3 つの ListBox 要素を作成します。各 ListBox は、StackPanel の Orientation プロパティ、HorizontalAlignment プロパティ、および VerticalAlignment プロパティに指定できる値を表しています。ユーザーがいずれかの ListBox 要素で値を選択すると、StackPanel 要素の関連するプロパティと、その子要素である Button が変わります。

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

次の分離コード ファイルでは、ListBox の選択の変更に関連付けられているイベントに対する変更を定義します。StackPanel は、sp1 というNameで識別されます。

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

サンプル全体については、「StackPanel の配置のサンプル」を参照してください。

参照

概念

パネルの概要

参照

StackPanel

ListBox

HorizontalAlignment

VerticalAlignment