WPF - 使一个控件垂直拉伸

Question

我是WPF/XAML的新手，几个小时后我得到了一个GUI，除了一件事情之外，它是很有代表性的。我得到了控件来调整窗口的水平大小，但我无法弄清楚我缺少的垂直方向。我只想让DataGrid控件垂直拉伸。 Datagrid控件没有得到提示。我错过了什么？

<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> 

溶液添加的控件和评论

<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

网格将展开以填充其父项。如果您不会添加更多内容，则可以在窗口中使用根级网格。

要将两个控件放置在一个网格上方，定义行，并且不要忽略将Grid.Row="..."属性添加到子控件以确定它们将在哪个网格行中，否则它们将会叠加在一起。

<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> 

如果你已经有了一系列的自动调整大小的孩子，会是相邻的，也可以是简单的做一个行一个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

你把它放在一个StackPanel。

Stackpanels只能增长到其内容需要的大小，您应该使用Grid来代替，网格和它们的单元格将填充它们的容器。