如何拉伸HeaderedContentControl的内容？

Question

我有一个包含TreeView的HeaderedContentControl。

    <HeaderedContentControl Header="Steps" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
        <TreeView Name="WizardSteps" ItemsSource="{Binding WizardSteps}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <!-- Hierarchical data templates here -->
        </TreeView>
    </HeaderedContentControl>

尽管HeaderedContentControl可以自动拉伸以填满其父级网格内的区域，但我的TreeView控件只占用可用空间的一小部分。如何使我的TreeView扩展以填充HeaderedContentControl的内容区域？

- dthrasher

Answer 1

HeaderedContentControl 的默认控件模板如下所示：

<ControlTemplate TargetType="{x:Type HeaderedContentControl}">
    <StackPanel>
        <ContentPresenter ContentSource="Header" />
        <ContentPresenter />
    </StackPanel>
</ControlTemplate>

StackPanel允许每个子元素拥有自己期望的高度，因此TreeView不会被拉伸。您可以将其替换为使用DockPanel的模板：

<HeaderedContentControl Header="Steps" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" VerticalContentAlignment="Stretch" >
    <HeaderedContentControl.Template>
        <ControlTemplate TargetType="HeaderedContentControl">
            <DockPanel>
                <ContentPresenter DockPanel.Dock="Top" ContentSource="Header" />
                <ContentPresenter />
            </DockPanel>
        </ControlTemplate>
    </HeaderedContentControl.Template>

如果您想使其更具可重用性，请将模板设置在样式中，并使用VerticalContentAlignment：

<Style TargetType="HeaderedContentControl">
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="HeaderedContentControl">
                <DockPanel>
                    <ContentPresenter DockPanel.Dock="Top" ContentSource="Header" />
                    <ContentPresenter VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                </DockPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这样，所有的HeaderedContentControls默认都会填充其内容，你可以通过在单个控件上设置VerticalContentAlignment来覆盖它。

或者，您可以直接使用DockPanel而不是HeaderedContentControl。

- Quartermeister

---

感谢您详细的解释和XAML代码片段。我想我可能会直接使用DockPanel，但看到ControlTemplates如何实现相同效果的示例也很好。 - dthrasher