Freigeben über

Gewusst wie: Erstellen eines StackPanel

  • Artikel

In diesem Beispiel wird die Erstellung einer StackPanel gezeigt:

Beispiel

StackPanel ermöglicht es Ihnen, Elemente in einer bestimmten Richtung zu stapeln. Mithilfe von Eigenschaften, die auf StackPanel definiert sind, kann Inhalt jeweils vertikal (Standardeinstellung) oder horizontal fießen.

Im folgenden Beispiel werden fünf TextBlock Steuerelemente vertikal gestapelt, jeweils mit einem anderen Border und Background, mithilfe von StackPanel. Die untergeordneten Elemente, für die keine Width gemacht wurden, werden so gedehnt, dass sie das übergeordnete Fenster ausfüllen; die untergeordneten Elemente, für die eine Width gemacht wurde, werden jedoch innerhalb des Fensters zentriert.

Die Standard-Stapelrichtung in StackPanel ist vertikal. Zum Steuern des Inhaltsflusses in einem StackPanel, verwenden Sie die Orientation-Eigenschaft. Sie können die horizontale Ausrichtung mit Hilfe der HorizontalAlignment-Eigenschaft steuern.

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" WindowTitle="StackPanel Sample">  
  <StackPanel>  
    <Border Background="SkyBlue" BorderBrush="Black" BorderThickness="1">  
      <TextBlock Foreground="Black" FontSize="12">Stacked Item #1</TextBlock>  
    </Border>  
    <Border Width="400" Background="CadetBlue" BorderBrush="Black" BorderThickness="1">  
      <TextBlock Foreground="Black" FontSize="14">Stacked Item #2</TextBlock>  
    </Border>  
    <Border Background="LightGoldenRodYellow" BorderBrush="Black" BorderThickness="1">  
      <TextBlock Foreground="Black" FontSize="16">Stacked Item #3</TextBlock>  
    </Border>  
    <Border Width="200" Background="PaleGreen" BorderBrush="Black" BorderThickness="1">  
      <TextBlock Foreground="Black" FontSize="18">Stacked Item #4</TextBlock>  
    </Border>  
    <Border Background="White" BorderBrush="Black" BorderThickness="1">  
      <TextBlock Foreground="Black" FontSize="20">Stacked Item #5</TextBlock>  
    </Border>  
  </StackPanel>  
</Page>

Weitere Informationen