CODEWITHSUNDEEP
wpflayoutgrid
Ondrej Janacek
Ondrej Janacek

Reputation: 12616

WPF Grid layout

Is it possible to design something like this using Grid in WPF? Design columns is easy, but what about rows? Or is there any better solution, like another container? Imagine each rectangle as module (GroupBox).

Grid layout

Upvotes: 4

Views: 2430

Answers (2)

MichaelS
MichaelS

Reputation: 7103

Define your columns and rows. Put each Groupbox on the desired row and column, and set its rowspan in order to define on how many rows it stretches.

Upvotes: 0

HCL
HCL

Reputation: 36765

Make an outer Grid with two columns. Within this grid, place two other grids, one per column. This will lead to the desired layout.

Here an example of how to do. Please note that I have placed some stars for the heights. Change them accordingly to your needs.

<Grid>
 <Grid.ColumnDefinitions>
   <Grid.ColumnDefinition Width="*" />
   <Grid.ColumnDefinition Width="*" />
 <Grid.ColumnDefinitions>

 <Grid Grid.Column="0">
   <Grid.RowDefinitions>
      <RowDefinition Height="Auto"/>
      <RowDefinition Height="Auto"/>
      <RowDefinition Height="Auto"/>
      <RowDefinition Height="*"/>
   </Grid.RowDefinitions>

   <!-- Here content elements of the first column -->

 </Grid>

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

   <!-- Here content elements of the second column -->

 </Grid>


</Grid>

Upvotes: 5

Related Questions