WPF：自定义可折叠Expander UserControl遇两类问题求助

我正在实现一个具备UI折叠/展开功能的自定义Expander UserControl，当前代码如下：

Expander的XAML代码 #

<UserControl x:Name="root">
    <StackPanel>
        <TextBlock Text="{Binding Caption, ElementName=root}"/>
        <ToggleButton Content="{Binding ToggleText}" IsChecked="{Binding Expanded}"/>
        <ContentControl Visibility="{Binding Expanded, Converter={x:Static root:GlobalConverters.BoolToCollapsedVisibilityConverter}}" Content="{Binding Content, ElementName=root}" />
    </StackPanel>
</UserControl>

Expander后台代码 #

public Expander()
{
    InitializeComponent();
    DataContext = new ViewModels.ExpanderViewModel();
}

public static readonly DependencyProperty CaptionProperty =
    DependencyProperty.Register("Caption", typeof(string), typeof(Expander), new PropertyMetadata("unkown caption"));

public string Caption
{
    get => (string)GetValue(CaptionProperty);
    set => SetValue(CaptionProperty, value);
}

public new static readonly DependencyProperty ContentProperty =
    DependencyProperty.Register("ItemsSource", typeof(object[]), typeof(Expander), new PropertyMetadata(Array.Empty<EmptyContent>()));

public new object[] Content
{
    get => (object[])GetValue(ContentProperty);
    set => SetValue(ContentProperty, value);
} 

使用示例 #

<DataTemplate DataType="{x:Type viewModels:OrdersListModeViewModel}">
    <StackPanel>
        <controls:Expander Caption="Orders">
            <ItemsControl ItemsSource="{Binding Orders}" />
        </controls:Expander>
    </StackPanel>
</DataTemplate>

当前遇到的问题 #

• 设计器显示错误界面，删除obj和bin目录后无效
• Expander.xaml出现绑定错误，无法理解为什么<controls:Expander>的内部内容没有使用自身的DataContext

问题解决方法 #

核心错误分析与修复 #

1. Content依赖属性注册错误

注册ContentProperty时存在两处致命错误：

• 注册名写成了"ItemsSource"，与属性名Content完全不符
• 属性类型定义为object[]，但实际使用时传入的是单个UI元素（如示例中的ItemsControl），应该改为object类型

修正后的Content属性代码：

public static readonly DependencyProperty ContentProperty =
    DependencyProperty.Register("Content", typeof(object), typeof(Expander), new PropertyMetadata(null));

public object Content
{
    get => GetValue(ContentProperty);
    set => SetValue(ContentProperty, value);
}

2. UserControl强行设置DataContext导致上下文覆盖

在构造函数中直接设置DataContext = new ExpanderViewModel();，会覆盖外部使用时传入的DataContext（如示例中的OrdersListModeViewModel）。这会导致内部ItemsControl绑定{Binding Orders}时，找不到对应的属性，同时触发设计器错误。

正确做法：不设置整个UserControl的DataContext，将ViewModel限定在内部元素的绑定范围内。可以通过ElementName绑定到UserControl的ViewModel属性：

后台代码调整

public Expander()
{
    InitializeComponent();
    ViewModel = new ViewModels.ExpanderViewModel();
}

// 暴露ViewModel作为控件属性，用于内部绑定
public ViewModels.ExpanderViewModel ViewModel { get; }

// 保留原Caption属性代码不变

XAML绑定调整

<StackPanel>
    <TextBlock Text="{Binding Caption, ElementName=root}"/>
    <ToggleButton Content="{Binding ViewModel.ToggleText, ElementName=root}" 
                  IsChecked="{Binding ViewModel.Expanded, ElementName=root}"/>
    <ContentControl Visibility="{Binding ViewModel.Expanded, ElementName=root, Converter={x:Static root:GlobalConverters.BoolToCollapsedVisibilityConverter}}" 
                    Content="{Binding Content, ElementName=root}" />
</StackPanel>

3. 设计器错误额外处理

完成上述修正后，尝试以下操作：

• 点击设计器的"重新加载设计器"按钮
• 重启Visual Studio
• 确认GlobalConverters.BoolToCollapsedVisibilityConverter是静态可访问的公共类

内容的提问来源于stack exchange，提问作者Olafvolafka