WPF Сітка

2075 / WPF / Сітка

 

1 2
3 4

 

<Grid>
  <Grid.RowDefinitions>
    <RowDefinition />
    <RowDefinition />
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
    <ColumnDefinition />
    <ColumnDefinition />
  </Grid.ColumnDefinitions>

  <Button Grid.Row="0" Grid.Column="0" Content="1" />
  <Button Grid.Row="0" Grid.Column="1" Content="2" />
  <Button Grid.Row="1" Grid.Column="0" Content="3" />
  <Button Grid.Row="1" Grid.Column="1" Content="4" />
</Grid>

 

1 2 3

 

<Grid>
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="2*" />
  </Grid.ColumnDefinitions>
  <Button Grid.Column="0" Content="1" />
  <Button Grid.Column="1" Content="2" />
  <Button Grid.Column="2" Content="3" />
</Grid>

 

 

1
2
3

 

<Grid>
  <Grid.RowDefinitions>
    <RowDefinition Height="*" />
    <RowDefinition Height="*" />
    <RowDefinition Height="2*" />
  </Grid.RowDefinitions>
  <Button Grid.Row="0">1</Button>
  <Button Grid.Row="1">2</Button>
  <Button Grid.Row="2">3</Button>
</Grid>

 

 

Об'єднати 2 рядки

<Button Grid.Row="0" Grid.ColumnSpan="2">1</Button>
<Button Grid.Row="1" Grid.Column="0">3</Button>
<Button Grid.Row="1" Grid.Column="1">4</Button>

 

Об'єднати 2 стовпчики

<Button Grid.RowSpan="2" Grid.Column="0">1</Button>
<Button Grid.Row="0" Grid.Column="1">2</Button>
<Button Grid.Row="1" Grid.Column="1">4</Button>

 

Елементи в рядок по вертикалі

<StackPanel>
</StackPanel>

Елементи в рядок по горизонталі

<StackPanel Orientation="Horizontal">
</StackPanel>

Елементи в рядок по горизонталі справа наліво

<StackPanel Orientation="Horizontal" FlowDirection="RightToLeft">
</StackPanel>

 

Сітка в сітці

<Grid>
  <Grid.ColumnDefinitions>
    <ColumnDefinition/>
    <ColumnDefinition/>
  </Grid.ColumnDefinitions>

  <Button Grid.Column="0">1</Button>

  <Grid Grid.Column="1">
    <Grid.RowDefinitions>
      <RowDefinition/>
      <RowDefinition/>
    </Grid.RowDefinitions>

    <Button Grid.Row="0">2</Button>
    <Button Grid.Row="1">3</Button>
  </Grid>
</Grid>




Height="auto" - 0, або по мінімальному розміру елемента в середині

 

 
[ DockPanel ]

[ UniformGrid ]

[ GridSplitter ]

[ WrapPanel ]

[ Canvas ]

[ Одиниці виміру ]