WPF - Resizing Columns and Rows in a Grid

Ok, I'm using the grid to list various content. How can I get specific colums to resize while others stay fixed.

That is, form pops up with specifc Initial column sizes for the controls... if the user RESIZES the form... i want certain 'memo' like fields to expand. How to do that? i seem to only be able to get ALL 'second' columns to expand in height... not just 1 (last one)... or specific ones.

Thanks for any help!!

Here is the layout... how can i make the 'long' text resizeable with form resize, and keep the button glued to the bottom of the form??? tx

<DockPanel VerticalAlignment="Top">
    <Grid DockPanel.Dock="Top" VerticalAlignment="Top" HorizontalAlignment="Stretch" Grid.Column="0" Margin="10,10,10,10" >
      <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"></ColumnDefinition>
        <ColumnDefinition MinWidth="150" ></ColumnDefinition>        
      </Grid.ColumnDefinitions>

      <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition MinHeight="80" Height="Auto"></RowDefinition>
        <RowDefinition ></RowDefinition>
      </Grid.RowDefinitions>

      <Label Grid.Column="0" Grid.Row="0" Content="Test1"/>
      <Label Grid.Column="0" Grid.Row="1" Content="Test2 -Long notes"/>
      <Label Grid.Column="0" Grid.Row="2" Content="Test3"/>

      <TextBox Height="Auto" Grid.Column="1" Grid.Row="0" />
      <TextBox Height="Auto" Grid.Column="1" Grid.Row="1" TextWrapping="Wrap" AcceptsReturn="True" VerticalScrollBarVisibility="Auto" />
      <TextBox Height="Auto" Grid.Column="1" Grid.Row="2" />

    </Grid>
    <StackPanel DockPanel.Dock="Bottom" Orientation="Horizontal" HorizontalAlignment="Right" MinHeight="20" Margin=" 0,0,10,10">
      <Button Content="OK" Margin="0,0,10,0" Width="75" IsDefault="True"/>
      <Button Content="Cancel" Width="75" IsCancel="True" />
    </StackPanel>
  </DockPanel>

(added after 1st 'answer') Now, if i remove the bottom stackpanel (Ok, Cancel buttons) out of equation to make this easier and i set the 1st and 2nd rows to a fixed value... i seem to be able to get this working (don't want to have to set a max height though) ... oh and i need to change the verticalAlignment to 'stretch'. But as soon as i add the StackPanel for the buttons again... the stretching no longer works... so here is the next revised version...

<DockPanel VerticalAlignment="Stretch">
    <Grid DockPanel.Dock="top"  开发者_Go百科VerticalAlignment="Stretch" Grid.Column="0"  Margin="10,10,10,10" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
            <ColumnDefinition MinWidth="150" Width="*"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions>
            <RowDefinition MaxHeight="30"></RowDefinition>
            <RowDefinition MinHeight="80" Height="*"></RowDefinition>
            <RowDefinition MaxHeight="30"></RowDefinition>
        </Grid.RowDefinitions>

        <Label Grid.Column="0" Grid.Row="0" Content="Test1"/>
        <Label Grid.Column="0" Grid.Row="1" Content="Test2 -Long notes"/>
        <Label Grid.Column="0" Grid.Row="2" Content="Test3"/>

        <TextBox Grid.Column="1" Grid.Row="0" />
        <TextBox Grid.Column="1" Grid.Row="1" TextWrapping="Wrap" AcceptsReturn="True" VerticalScrollBarVisibility="Auto" />
        <TextBox Grid.Column="1" Grid.Row="2" />
    </Grid>

    <StackPanel DockPanel.Dock="Bottom" VerticalAlignment="Bottom" HorizontalAlignment="Right" Orientation="Horizontal" MinHeight="20" Margin=" 0,0,10,10">
        <Button Content="OK" Margin="0,0,10,0" Width="75" IsDefault="True"/>
        <Button Content="Cancel" Width="75" IsCancel="True" />
    </StackPanel>
</DockPanel>

So I'm still having problems...

---

Use * for the column width instead of Auto, which tells the column to take up whatever space is left after the other columns are set.

If you need multiple columns to share the available space in different percentages, you can prefix the * with a number, as in "2*" and "3*". By default, "" means 1.

HTH,
Berryl

---

I seem to only be able to solve the problems by incorporting the StackPanel in its own grid row, and column. Here is my solution. Not sure if dock panel is necessary in this case... but without tinkering more ... that's my current solution. If any one can explain to me how to get it working with the stack panel OK, Cancel buttons 'outside' the grid, i'd love to know. Meanwhile, this solution is available for those of you looking into this sort of problem. As you see you need to use Auto in all the other row definitions. * where u want it to expand.

<DockPanel VerticalAlignment="Stretch">
        <Grid DockPanel.Dock="top"  VerticalAlignment="Stretch" Grid.Column="0"  Margin="10,10,10,10" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"></ColumnDefinition>
                <ColumnDefinition MinWidth="150" Width="*"></ColumnDefinition>
            </Grid.ColumnDefinitions>

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

            <Label Grid.Column="0" Grid.Row="0" Content="Test1"/>
            <Label Grid.Column="0" Grid.Row="1" Content="Test2 -Long notes"/>
            <Label Grid.Column="0" Grid.Row="2" Content="Test3"/>

            <TextBox Grid.Column="1" Grid.Row="0" />
            <TextBox Grid.Column="1" Grid.Row="1" TextWrapping="Wrap" AcceptsReturn="True" VerticalScrollBarVisibility="Auto" />
            <TextBox Grid.Column="1" Grid.Row="2" />

            <StackPanel Grid.Column="1" Grid.Row="3" VerticalAlignment="Bottom" HorizontalAlignment="Right" Orientation="Horizontal" MinHeight="20" Margin=" 0,10,0,0">
                <Button Content="OK" Margin="0,0,10,0" Width="75" IsDefault="True"/>
                <Button Content="Cancel" Width="75" IsCancel="True" />
            </StackPanel>
        </Grid>
    </DockPanel>

---

If you want to be able to re-size only one of the squares made by the Row and Column Definitions you should add a Grid or whichever container element inside of one the squares. Then you'll make the Grid inside the square re-size accordingly. This way all the Definitions won't re-size, instead the grid and it's elements inside will re-size and thus not changing the other elements. It's not common but you can have as many stack panels and grids and set their visibility when needed. Sometimes when something doesn't work stick them inside something else and experiment with it. You might just get it by accident, but you'll still get it.