WPF自定义控件切换ListBox数据模板致选中项异常求助

控件基础 #

我实现了一个继承自System.Windows.Controls.MultiSelector的WPF自定义弹出菜单控件，包含以下关键依赖属性：

• Style: ListBoxStyle
• Style: ItemContainerStyle
• DataTemplate: ExpandedItemTemplate
• DataTemplate: CollapsedItemTemplate
• DataTemplate: CurrentItemTemplate（只读）
• bool: IsExpanded

初始状态下，通过IsExpanded切换两种数据模板展示不同视图，代码如下：

<Setter Property="ExpandedItemTemplate">
    <Setter.Value>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <CheckBox IsChecked="{Binding MyItemIsSelected, Mode=TwoWay}" />
                <TextBlock Grid.Column="1"
                           Text="{Binding MyItemHeader}" />
            </Grid>
        </DataTemplate>
    </Setter.Value>
</Setter>

<Setter Property="CollapsedItemTemplate">
    <Setter.Value>
        <DataTemplate>
            <ToggleButton IsChecked="{Binding MyItemIsSelected, Mode=TwoWay}"
                          Content="{StaticResource MyItemIcon}"
                          ToolTip="{Binding MyItemHeader}" />
        </DataTemplate>
    </Setter.Value>
</Setter>

此时弹出菜单功能正常，数据绑定初始正确，展开/折叠切换无问题。

问题触发场景 #

为了利用ListBoxItem的IsSelected视觉状态，添加了绑定业务属性的ItemContainerStyle：

<Setter Property="ItemContainerStyle">
    <Setter.Value>
        <Style TargetType="{x:Type ListBoxItem}"
               BasedOn="{StaticResource MySpecialListBoxItemStyle}">
            <Setter Property="IsSelected"
                    Value="{Binding MyItemIsSelected, Mode=TwoWay}" />
        </Style>
    </Setter.Value>
</Setter>

内部ListBox的ControlTemplate代码：

<ListBox Grid.Row="1"
         Style="{TemplateBinding ListBoxStyle}"
         ItemsSource="{TemplateBinding MyItems}"
         ItemContainerStyle="{TemplateBinding ItemContainerStyle}"
         ItemTemplate="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type c:MyPopOutMenu}}, Path=CurrentItemTemplate}"
         IsSynchronizedWithCurrentItem="True"
         SelectionMode="Multiple" />

后台通过IsExpanded更新CurrentItemTemplate的方法：

private static void UpdateMenuItemTemplate(MyPopOutMenu menu, bool expanded)
{
    if (expanded)
    {
        menu.SetValue(CurrentItemTemplatePropertyKey, menu.ExpandedItemTemplate);
    }
    else
    {
        menu.SetValue(CurrentItemTemplatePropertyKey, menu.CollapsedItemTemplate);
    }
}

问题描述 #

添加上述ItemContainerStyle后，切换CurrentItemTemplate会导致内部ListBox的SelectedItems随机变更。推测原因是ListBox内部复用了对应不同数据模板的ListBoxItem实例，切换模板时陈旧容器触发双向绑定更新，导致视觉状态变更影响业务逻辑。已尝试使用CollectionView替代直接绑定ItemsSource、设置IsSynchronizedWithCurrentItem，均未解决问题。

解决建议 #

1. 临时禁用绑定切换模板 #

在切换模板前后临时替换ItemContainerStyle，避免陈旧容器触发绑定更新：

private static void UpdateMenuItemTemplate(MyPopOutMenu menu, bool expanded)
{
    // 保存原有样式，临时替换为无绑定的基础样式
    var originalStyle = menu.ItemContainerStyle;
    menu.ItemContainerStyle = new Style(typeof(ListBoxItem), originalStyle.BasedOn);
    
    // 更新当前模板
    menu.SetValue(CurrentItemTemplatePropertyKey, expanded ? menu.ExpandedItemTemplate : menu.CollapsedItemTemplate);
    
    // 延迟恢复原有样式，确保容器重建完成后绑定重新生效
    Application.Current.Dispatcher.BeginInvoke(DispatcherPriority.Background, () =>
    {
        menu.ItemContainerStyle = originalStyle;
    });
}

2. 强制容器重新生成 #

通过临时重置ItemsSource触发ListBox重建所有ListBoxItem，避免复用陈旧容器：

private static void UpdateMenuItemTemplate(MyPopOutMenu menu, bool expanded)
{
    // 更新模板
    menu.SetValue(CurrentItemTemplatePropertyKey, expanded ? menu.ExpandedItemTemplate : menu.CollapsedItemTemplate);
    
    // 临时清空再恢复ItemsSource，强制容器重建
    var tempItems = menu.MyItems;
    menu.MyItems = null;
    Application.Current.Dispatcher.BeginInvoke(DispatcherPriority.Background, () =>
    {
        menu.MyItems = tempItems;
    });
}

注意：需确保MyItems作为依赖属性能正确触发变更通知。

3. 使用DataTemplateSelector替代模板切换 #

放弃通过CurrentItemTemplate切换模板，改用DataTemplateSelector实时根据IsExpanded选择模板，避免容器复用冲突：

public class MenuItemTemplateSelector : DataTemplateSelector
{
    public DataTemplate ExpandedTemplate { get; set; }
    public DataTemplate CollapsedTemplate { get; set; }
    
    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        var menu = FindAncestor<MyPopOutMenu>(container);
        return menu?.IsExpanded == true ? ExpandedTemplate : CollapsedTemplate;
    }
    
    private T FindAncestor<T>(DependencyObject obj) where T : DependencyObject
    {
        while (obj != null)
        {
            if (obj is T ancestor)
                return ancestor;
            obj = VisualTreeHelper.GetParent(obj);
        }
        return null;
    }
}

修改ControlTemplate中的ListBox配置：

<ListBox Grid.Row="1"
         Style="{TemplateBinding ListBoxStyle}"
         ItemsSource="{TemplateBinding MyItems}"
         ItemContainerStyle="{TemplateBinding ItemContainerStyle}"
         IsSynchronizedWithCurrentItem="True"
         SelectionMode="Multiple">
    <ListBox.ItemTemplateSelector>
        <c:MenuItemTemplateSelector 
            ExpandedTemplate="{TemplateBinding ExpandedItemTemplate}"
            CollapsedTemplate="{TemplateBinding CollapsedItemTemplate}" />
    </ListBox.ItemTemplateSelector>
</ListBox>

此方式无需切换模板，由Selector实时匹配状态，从根源避免容器复用导致的绑定问题。

4. 单向绑定+手动同步状态 #

将IsSelected改为单向绑定，手动同步业务数据与ListBox选中状态：

<Setter Property="ItemContainerStyle">
    <Setter.Value>
        <Style TargetType="{x:Type ListBoxItem}"
               BasedOn="{StaticResource MySpecialListBoxItemStyle}">
            <Setter Property="IsSelected"
                    Value="{Binding MyItemIsSelected, Mode=OneWay}" />
        </Style>
    </Setter.Value>
</Setter>

后台添加同步逻辑：

// 控件初始化时注册ListBox事件
private void AttachListBoxSync(ListBox listBox)
{
    // 监听ListBox选中变更，同步到业务数据
    listBox.SelectionChanged += (s, e) =>
    {
        foreach (var item in e.AddedItems)
        {
            if (item is MyItemModel model)
                model.MyItemIsSelected = true;
        }
        foreach (var item in e.RemovedItems)
        {
            if (item is MyItemModel model)
                model.MyItemIsSelected = false;
        }
    };

    // 监听业务数据属性变更，同步到ListBox选中状态
    foreach (var item in MyItems)
    {
        if (item is INotifyPropertyChanged notifyItem)
        {
            notifyItem.PropertyChanged += (s, e) =>
            {
                if (e.PropertyName == nameof(MyItemModel.MyItemIsSelected))
                {
                    var model = (MyItemModel)s;
                    Application.Current.Dispatcher.BeginInvoke(() =>
                    {
                        if (model.MyItemIsSelected && !listBox.SelectedItems.Contains(model))
                            listBox.SelectedItems.Add(model);
                        else if (!model.MyItemIsSelected && listBox.SelectedItems.Contains(model))
                            listBox.SelectedItems.Remove(model);
                    });
                }
            };
        }
    }
}

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