XAML：为 Expander 中表示的 ViewModel 创建 DataTemplate答案

【问题标题】：XAML: Creating a DataTemplate for a ViewModel represented in an ExpanderXAML：为 Expander 中表示的 ViewModel 创建 DataTemplate
【发布时间】：2011-05-31 13:35:00
【问题描述】：

假设我有一个类似于 Expander 的自定义控件，并将在该扩展器中显示多种类型的对象。我想为每种类型的对象定义一个 DataTemplate。

现在我想在未展开时显示特定信息，在展开时显示其他信息。

通常使用扩展器它只显示绑定到 Header 属性的任何内容。

我能否以某种方式在 DataTemplate 中为每个视图定义两个区域？

也许还有其他绝妙的方法可以做到这一点？

【问题讨论】：

所以如果我理解正确，而不是展开和折叠，它真的是在以两种不同的方式显示相同的数据之间切换？
@Joel 是的，你可以这么说。它也可以被视为一个包含更多信息的标题，而不仅仅是一个属性。我实际上打算将此样式应用于 ListBox 并让 selectedItem 展开，而其他人则显示最相关的信息。

标签： wpf xaml user-controls datatemplate expander

【解决方案1】：

试试这个：

<DataTemplate x:Key="ExpanderItemDataTemplate">
        <Grid x:Name="LayoutRoot">
            <Grid x:Name="ExpandedContent" />
            <Grid x:Name="CollapsedContent" />
        </Grid>
        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding IsExpanded, RelativeSource={RelativeSource AncestorType=local:YourCustomControl}}"
                         Value="True">
                <Setter Property="Visibility"
                        TargetName="ExpandedContent"
                        Value="Visible" />
                <Setter Property="Visibility"
                        TargetName="CollapsedContent"
                        Value="Collapse" />
            </DataTrigger>
            <DataTrigger Binding="{Binding IsExpanded, RelativeSource={RelativeSource AncestorType=local:YourCustomControl}}"
                         Value="False">
                <Setter Property="Visibility"
                        TargetName="ExpandedContent"
                        Value="Collapse" />
                <Setter Property="Visibility"
                        TargetName="CollapsedContent"
                        Value="Visible" />
            </DataTrigger>
        </DataTemplate.Triggers>

【讨论】：

所以我会为我要使用的每种类型创建一个，并将正确的视图添加到每个网格中？可以工作。顺便说一句，你是冰岛人（Eyjafjallajökull）吗？
我不是，但我真的很喜欢这个词。
我可以反过来做吗？将触发器放在控件中并让它们针对将绑定的 dataTemplate 内的命名区域？那是我真正不想做的事情。

【解决方案2】：

您是否考虑过简单地使用 TabControl ？例如，您可以添加两个选项卡并设置它们的样式。这是标签样式的代码：

    <Style TargetType="{x:Type TabPanel}">
        <!--Whatever you need for tab position (here center) -->
        <Setter Property="HorizontalAlignment" Value="Center" />
    </Style>

和

           <ControlTemplate x:Key="TabItemTemplate" TargetType="{x:Type TabItem}">
                <!-- Place whatever control you want for design (grid, dockpanel... -->
                <!-- And then the triggers you'd need for, here, color if selected or not, as an example -->
                <ControlTemplate.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter TargetName="Border" Property="Background" Value="Blue" />
                    </Trigger>
                    <Trigger Property="IsSelected" Value="False">
                        <Setter TargetName="Border" Property="Background" Value="WhiteSmoke" />
                    </Trigger>

                </ControlTemplate.Triggers>
            </ControlTemplate>

这是我认为的自然方式。您可以将此代码扩展为，例如，当您单击唯一可见的选项卡时添加一个更改选定选项卡的触发器。无论如何，您所描述的行为似乎更适合 TabControl 而不是 Expander

【讨论】：

感谢您的建议，如果我能解决这个问题，它可以工作，但我不想没有实际的选项卡，所以从 Itemscontrol 开始可能会更容易.