Gewusst wie: Positionieren der untergeordneten Elemente eines Rasters

In diesem Beispiel wird gezeigt, wie die auf Grid definierten Get- und Set-Methoden zum Positionieren untergeordneter Elemente verwendet werden.

Beispiel

Im folgenden Beispiel wird ein übergeordnetes Grid-Element (grid1) definiert, das über drei Spalten und drei Zeilen verfügt. Ein untergeordnetes Rectangle-Element (rect1) wird zum Grid-Element an Spaltenposition 0 (null), Zeilenposition 0 (null) hinzugefügt. Button-Elemente stellen Methoden dar, die aufgerufen werden können, um das Rectangle-Element im Grid-Element neu zu positionieren. Wenn ein Benutzer auf eine Schaltfläche klickt, wird die zugehörige Methode aktiviert.

    <StackPanel Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Orientation="Vertical">
      <Button Click="setCol0">Move Rectangle to Column 0</Button>
      <Button Click="setCol1">Move Rectangle to Column 1</Button>
      <Button Click="setCol2" Margin="0,0,0,10">Move Rectangle to Column 2</Button>
      <Button Click="setRow0">Move Rectangle to Row 0</Button>
      <Button Click="setRow1">Move Rectangle to Row 1</Button>
      <Button Click="setRow2" Margin="0,0,0,10">Move Rectangle to Row 2</Button>
      <Button Click="setColspan">Span All Columns</Button>
      <Button Click="setRowspan">Span All Rows</Button>
      <Button Click="clearAll">Clear All</Button>
    </StackPanel>
  </Grid>
<Grid DockPanel.Dock="Top" Margin="0,10,15,0" HorizontalAlignment="Left" Name="grid1" ShowGridLines="True" Width="400" Height="400" Background="LightSteelBlue">
  <Grid.ColumnDefinitions>
  <ColumnDefinition/>
  <ColumnDefinition/>
  <ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
  <RowDefinition/>
  <RowDefinition/>
  <RowDefinition/>
</Grid.RowDefinitions>

  <Rectangle Name="rect1" Fill="Silver" Grid.Column="0" Grid.Row="0"/>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="0" Grid.Row="0" Margin="5">Column 0, Row 0</TextBlock>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="1" Grid.Row="0" Margin="5">Column 1, Row 0</TextBlock>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="2" Grid.Row="0" Margin="5">Column 2, Row 0</TextBlock>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="0" Grid.Row="1" Margin="5">Column 0, Row 1</TextBlock>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="1" Grid.Row="1" Margin="5">Column 1, Row 1</TextBlock>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="2" Grid.Row="1" Margin="5">Column 2, Row 1</TextBlock>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="0" Grid.Row="2" Margin="5">Column 0, Row 2</TextBlock>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="1" Grid.Row="2" Margin="5">Column 1, Row 2</TextBlock>
  <TextBlock FontSize="15" HorizontalAlignment="Right" VerticalAlignment="Bottom" Grid.Column="2" Grid.Row="2" Margin="5">Column 2, Row 2</TextBlock>
</Grid>

Im folgenden Code-Behind-Beispiel werden die Methoden behandelt, die von den Click-Ereignissen der Schaltfläche ausgelöst werden. Im Beispiel werden diese Methodenaufrufe in TextBlock-Elemente geschrieben, die zugehörige Get-Methoden verwenden, um die neuen Eigenschaftswerte als Zeichenfolgen auszugeben.

Private Sub setCol0(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Grid.SetColumn(rect1, 0)
    txt1.Text = "Rectangle is in Column " + Grid.GetColumn(rect1).ToString()
End Sub

Private Sub setCol1(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Grid.SetColumn(rect1, 1)
    txt1.Text = "Rectangle is in Column " + Grid.GetColumn(rect1).ToString()
End Sub

Private Sub setCol2(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Grid.SetColumn(rect1, 2)
    txt1.Text = "Rectangle is in Column " + Grid.GetColumn(rect1).ToString()
End Sub

Private Sub setRow0(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Grid.SetRow(rect1, 0)
    txt2.Text = "Rectangle is in Row " + Grid.GetRow(rect1).ToString()
End Sub

Private Sub setRow1(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Grid.SetRow(rect1, 1)
    txt2.Text = "Rectangle is in Row " + Grid.GetRow(rect1).ToString()
End Sub

Private Sub setRow2(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Grid.SetRow(rect1, 2)
    txt2.Text = "Rectangle is in Row " + Grid.GetRow(rect1).ToString()
End Sub

Private Sub setColspan(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Grid.SetColumnSpan(rect1, 3)
    txt3.Text = "ColumnSpan is set to " + Grid.GetColumnSpan(rect1).ToString()
End Sub
Private Sub setRowspan(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Grid.SetRowSpan(rect1, 3)
    txt4.Text = "RowSpan is set to " + Grid.GetRowSpan(rect1).ToString()
End Sub

        private void setCol0(object sender, RoutedEventArgs e) 
        {
            Grid.SetColumn(rect1, 0);
            txt1.Text = "Rectangle is in Column " + Grid.GetColumn(rect1).ToString();

        }
        private void setCol1(object sender, RoutedEventArgs e)
        {
            Grid.SetColumn(rect1, 1);
            txt1.Text = "Rectangle is in Column " + Grid.GetColumn(rect1).ToString();
        }
        private void setCol2(object sender, RoutedEventArgs e)
        {
            Grid.SetColumn(rect1, 2);
            txt1.Text = "Rectangle is in Column " + Grid.GetColumn(rect1).ToString();
        }
        private void setRow0(object sender, RoutedEventArgs e)
        {
            Grid.SetRow(rect1, 0);
            txt2.Text = "Rectangle is in Row " + Grid.GetRow(rect1).ToString();
        }
        private void setRow1(object sender, RoutedEventArgs e)
        {
            Grid.SetRow(rect1, 1);
            txt2.Text = "Rectangle is in Row " + Grid.GetRow(rect1).ToString();
        }
        private void setRow2(object sender, RoutedEventArgs e)
        {
            Grid.SetRow(rect1, 2);
            txt2.Text = "Rectangle is in Row " + Grid.GetRow(rect1).ToString();
        }
        private void setColspan(object sender, RoutedEventArgs e)
        {
            Grid.SetColumnSpan(rect1, 3);
            txt3.Text = "ColumnSpan is set to " + Grid.GetColumnSpan(rect1).ToString();
        }
        private void setRowspan(object sender, RoutedEventArgs e)
        {
            Grid.SetRowSpan(rect1, 3);
            txt4.Text = "RowSpan is set to " + Grid.GetRowSpan(rect1).ToString();
        }

Siehe auch

Referenz

Grid

Konzepte

Übersicht über Panel-Elemente