相互关联的堆栈面板尺寸

Question

我有一个递归定义的用户控件，需要以下属性：

有两列，

第一列包含一些文本周围的单个边框，

第二列包含一堆相同类型的控件（递归部分），

如果第一列中的框比第二列中堆叠的盒子的总高度短，盒子应该扩展以使两列具有相同的高度。

如果第二列的总高度比第一列中的框短，则第二列堆栈中的最后一项应展开，以便它们具有相同的高度。

例如，它可能看起来像这样：

好的，到目前为止我所做的是创建一个水平堆栈面板其中第一项是包含边框和文本的停靠面板...第二列是绑定到子列表的垂直堆栈面板，创建递归用户控件...像这样..

<StackPanel Orientation="Horizontal" Background="AliceBlue">
        <local:TMRequirementView Requirement="{Binding Baseline}" />
        <StackPanel Orientation="Vertical">
            <ItemsControl ItemsSource="{Binding Requirements}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <local:TMGridView Baseline="{Binding}" />
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </StackPanel>

其中要求如下所示：

    <DockPanel>
        <Border MinHeight="50"
                BorderBrush="Black" BorderThickness="2">
            <TextBlock Text="{Binding Description}" 
                       TextWrapping="Wrap" Background="Transparent" Height="Auto" />
        </Border>
    </DockPanel>

现在如果堆叠的列较高，则此方法效果很好，但如果第一列较高，则此方法不起作用，并且会出现间隙。知道如何处理这种相互高度依赖性吗？

---

更新： 因此，通过在右列堆栈面板周围添加边框，我能够看到堆栈面板实际上确实收到了最小高度更改。然而，即使有扩展空间，堆栈面板的子级也不会自动更新。如果我事先将堆栈面板的最小高度固定为较大的值，那么孩子们就会填满。我需要弄清楚如何根据堆栈面板最小高度的变化来更新儿童的高度。

Answer 1

我认为此布局中的 Grid 可以实现您所描述的功能。我将其放在 DockPanel 中，以便您可以看到它如何调整大小。尝试在文本框中输入内容并观察其行为：

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <DockPanel>  
    <Grid DockPanel.Dock="Top">
      <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
      </Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
      </Grid.RowDefinitions>
      <TextBox AcceptsReturn="True" Grid.Row="0" Grid.Column="0" Grid.RowSpan="3"></TextBox>
      <TextBox AcceptsReturn="True" Grid.Row="0" Grid.Column="1"></TextBox>
      <TextBox AcceptsReturn="True" Grid.Row="1" Grid.Column="1"></TextBox>
      <TextBox AcceptsReturn="True" Grid.Row="2" Grid.Column="1"></TextBox>
    </Grid>
    <TextBlock/>
  </DockPanel>
</Page>

Grid 的所有三行都将具有最小 TextBox 的高度（当您将 TextBox 替换为其他元素，您需要设置最小高度以防止它们在为空时消失）。由于第三行是星形大小的，因此它将根据前两行排列后剩余的所有剩余垂直空间调整自身大小。因此，如果第一列中有一堆内容，第二列中的第三行就会变得更高。

编辑

实际上，在这种情况下甚至没有理由使用Grid：您所描述的实际上是DockPanel的行为:

<DockPanel>
  <DockPanel DockPanel.Dock="Top">      
    <DockPanel.Resources>
      <Style TargetType="Label">
        <Setter Property="DockPanel.Dock" Value="Top"/>
        <Setter Property="Background" Value="Lavender"/>
        <Setter Property="Margin" Value="1"/>
      </Style>
    </DockPanel.Resources>
    <DockPanel LastChildFill="True">
      <Label>Foo</Label>
    </DockPanel>
    <DockPanel LastChildFill="True">
      <Label>Foo</Label>
      <Label>Bar</Label>
      <Label>Baz</Label>
      <Label>Bat</Label>
    </DockPanel>
  </DockPanel>
  <Label/>
</DockPanel>