XAML：为扩展器中表示的 ViewModel 创建数据模板

Question

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

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

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

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

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

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

Answer 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