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來代替，網格和它們的單元格將填充它們的容器。