WPF - Making ONE control stretch vertically - wpf

Question

I'm new to WPF/XAML and with a few hours I got a GUI that is presentable except for one thing. I got the controls to resize horizontally with the window but I cannot figure out what I'm missing to do the same vertically. I want only the DataGrid control to stretch vertically. The Datagrid control is not getting the hint. What am I missing?
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
MinHeight="480"
MinWidth="660"
Width="660"
Height="480"
Title="Windows Title">
<Grid Margin="0,0,-0.2,0.2">
<StackPanel Orientation="Vertical">
<DataGrid
x:Name="dataGrid"
Width="Auto"
Height="Auto"
MinHeight="300"
Grid.Row="0"
HorizontalAlignment="Stretch"
Margin="10,10,10,0"
VerticalAlignment="Stretch"
IsReadOnly="True"
TextBlock.FontSize="16"/>
<TextBox
x:Name="Interpretation"
Height="100"
MinHeight="100"
Width="Auto"
HorizontalAlignment="Stretch"
Margin="10,10,10,0"
IsReadOnly="True"
Text="Interpretation of Results"
TextAlignment="left"
TextBlock.FontSize="20"
TextWrapping="Wrap"/>
</StackPanel>
</Grid>
</Window>
SOLUTION with ADDED controls and comments
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Height="600"
MinHeight="600"
MinWidth="660"
Width="660"
Title="Windows Title">
<Grid>
<Grid.RowDefinitions>
<!-- Height="Auto" -> Fill space required by content -->
<!-- Height="*" -> Fill all space not taken up by other rows (The one that will stretch) -->
<RowDefinition Height="auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<!-- using HorizontalAlignment="Stretch" or Width="Auto" in the controls is redundant -->
<!-- Don't forget to add Grid.Row="#" properties in each control/row below -->
<TextBox
MinHeight="25"
Grid.Row="0"
HorizontalAlignment="Stretch"
Margin="10,10,10,0"
Background="#FF98D6EB"
Foreground="White"
IsReadOnly="True"
Text="Results"
TextAlignment="Center"
TextBlock.FontSize="20"
TextWrapping="Wrap"/>
<DataGrid
x:Name="dataGrid"
MinHeight="200"
Grid.Row="1"
Margin="10,10,10,0"
IsReadOnly="True"
TextBlock.FontSize="16"/>
<TextBox
x:Name="Interpretation"
MinHeight="100"
Grid.Row="2"
Margin="10,10,10,0"
Background="#FF98D6EB"
IsReadOnly="True"
Text="Interpretation of Results"
TextAlignment="left"
TextBlock.FontSize="20"
TextWrapping="Wrap"/>
<!-- UniformGrid speads the buttons size evenly with resizing of the window -->
<!-- HorizontalAlignment="Stretch" is redundant -->
<!-- notice the Grid.Row="3" is a property of <UniformGrid> and not the controls within it-->
<UniformGrid
Height="100"
Grid.Row="3"
Columns="2"
Rows="1">
<Button
Name="btnContinue"
MinWidth="250"
Margin="10"
Content="Continue"
TextBlock.FontSize="50"
TextBlock.FontWeight="Bold"/>
<Button
Name="btnCancel"
MinWidth="250"
Margin="10"
Content="Cancel"
TextBlock.FontSize="50"
TextBlock.FontWeight="Bold"/>
</UniformGrid>
</Grid>
</Window>

Answer 1

A Grid will expand to fill its parent. You can use the root level grid in your window, if you won't be adding any more content.
To put two controls in a grid one above the other, define rows, and don't neglect to add the Grid.Row="..." attribute to the child controls to determine which grid rows they'll be in, or else they'll be superimposed on one another.
<Grid Margin="0,0,-0.2,0.2">
<Grid.RowDefinitions>
<!-- Height="*" -> Fill all space not taken up by other rows -->
<RowDefinition Height="*" />
<!-- Height="Auto" -> Fill space required by content -->
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<DataGrid
Grid.Row="0"
x:Name="dataGrid"
Margin="10,10,10,0"
IsReadOnly="True"
TextBlock.FontSize="16"
/>
<TextBox
Grid.Row="1"
x:Name="Interpretation"
Height="100"
MinHeight="100"
Margin="10,10,10,0"
IsReadOnly="True"
Text="Interpretation of Results"
TextAlignment="left"
TextBlock.FontSize="20"
TextWrapping="Wrap"
/>
</Grid>
If you've got a series of auto-sized children that'll be adjacent, it can be simpler to make one row a StackPanel:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<DataGrid
Grid.Row="0"
...
/>
<StackPanel
Grid.Row="1"
Orientation="Vertical"
>
<Label>Stuff</Label>
<TextBox ... />
<Label>More Stuff</Label>
<TextBox ... />
</StackPanel>
</Grid>

Answer 2

You put it in a stackpanel.
Stackpanels only ever grow to the size their contents need, you should use Grid instead, grids and their cells will fill their container.