Matt H.
Matt H.

Reputation: 10786

Simple grid layout question

I can't believe I'm back to this after working with WPF for 3 months :)

Consider very common setup:

How do I configure the rowheights so that the top and bottom rows (menu bar and status bar) size to fit the height of their content, and the middle row (main content), fills the remaining available space in the program?

I can't fix the height of the top/bottom rows because the height of their content can vary.

<Window>
  <Grid>
    <Grid.RowDefinitions>
      <RowDefinition/>
      <RowDefinition/>
       <RowDefinition/>
    </Grid.RowDefinitions>

  <Menu Grid.Row=0>
  ...menuitems
  </Menu>

      <Grid Grid.Row=1>
       ...main application content here (like most programs)
      </Grid>

      <StatusBar>
      ...statusbaritems
      </StatusBar>
   </Grid>
</Window>

Upvotes: 2

Views: 1237

Answers (2)

Heinzi
Heinzi

Reputation: 172270

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

From GridUnitType Enumeration:

Auto: The size is determined by the size properties of the content object.
Star: The value is expressed as a weighted proportion of available space.

Upvotes: 4

Reed Copsey
Reed Copsey

Reputation: 564413

You use:

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

Auto will size to content, and * will fill space. If you had multiple "content" areas in between, you can use multiples, too:

<Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="2*" /> <!-- Will be 2/3rd of main space -->
    <RowDefinition Height="1*" /> <!-- Will be 1/3rd of main space -->
    <RowDefinition Height="Auto" />
</Grid.RowDefinitions>

Upvotes: 3

Related Questions