WPF - CollectionView 使用嵌套的分层数据模板在树视图中刷新,而不会丢失选择

本文关键字:刷新 视图 选择 CollectionView 嵌套 数据 分层 WPF | 更新日期: 2023-09-27 18:31:35

为什么这很难做到,说真的:P我有以下几点:

 public BindingList<Dialogue> Dialogues { get; set; }
 public CollectionView DialoguesCollectionView { get; set; }

在此视图模型的构造函数中,我执行以下操作:

SubDialogues = new BindingList<SubDialogue>();
SubDialogues.ListChanged += (sender, args) =>
{
    OnPropertyChanged(nameof(SubDialogues));
    //HACK: Temporary solution...
    if (args.ListChangedType == ListChangedType.ItemAdded ||
        args.ListChangedType == ListChangedType.ItemDeleted)
    {
        SubDialoguesCollectionView.Refresh();
    }
};
SubDialoguesCollectionView = new ListCollectionView(SubDialogues);
SubDialoguesCollectionView.SortDescriptions.Add(new SortDescription("Name", ListSortDirection.Ascending));

每当我修改绑定列表中的项目时,它都会立即反映出来。但是,这不计入添加或删除项目,因此我强制刷新。

但是,我还想在 Name 属性更改时刷新列表,因此它会相应地重新排序,这就是我的问题开始的地方。

我的视图中的树视图使用该SubDialoguesCollectionView作为其HierarchicalDataTemplate之一的ItemSource。每当我在 TreeView 中选择一个项目并且基础 CollectionView 因任何原因刷新时,它都会丢失选择,而是跳转到整个列表的父级。

我不希望这种情况发生,我想保留项目的选择,即使它的偏移量由于重新排序而发生了变化。谁能帮助我弄清楚如何让它按照我想要的方式工作?我真的尝试了一切:SortableBindingList,行为,移动项目而不是刷新,列表还在继续。我开始长白发了!:P

如果还有其他方法我可能忽略了,我也想听听。最后,我想要的只是一个列表,当任何绑定对象的 Name 属性更改时,该列表会重新排序,但不会丢失 TreeView 中对该对象的选择。


根据要求,我的代码库如何设置的复制/粘贴版本(albit简化和扁平化):https://gist.github.com/LennardF1989/59a42c7be474061f14bd

我省略了上面描述的失败尝试,这是我尝试任何事情之前的状态。

WPF - CollectionView 使用嵌套的分层数据模板在树视图中刷新,而不会丢失选择

这里实际上有几个问题在起作用。老实说,主要问题是您没有正确使用数据绑定,如果您使用的是 MVVM 之类的东西,那么您将操作视图模型并且 UI 会符合要求。实际上,内部与视图元素进行了一些复杂的交互。

在进一步讨论之前,我只想指出我对代码所做的一些更改。

  • 不要使用 BindingList,它根本无法很好地扩展;我已经用ObservableCollections替换了你的。
  • 您已经在导入 MVVM Lite,因此您也可以使用 ViewModelBase 而不是声明自己的 BaseViewModel。当然,由于 C# 不支持多重继承,您仍然会遇到 MainWindow 问题,但无论如何 MainWindow 中不应该有任何代码;)
  • 为了引导代码更好地进行数据绑定,我用附加的行为替换了更新 SelectedObject 的函数,源代码如下。(这与问题无关,所以我希望你能原谅我的放纵)。
  • 我创建了第二个字段,称为 SortedDialogues,它是对话的 CollectionViewSource。我还添加了按"名称"排序的排序描述。因此,对话可以单独保留,您可以绑定到排序对话,每当某些内容(即对话名称)发生变化时,您都会调用排序对话的Refresh()成员来更新排序。
  • 我只为对话做了这个,我会让你把它应用到任务等。

现在,正在发生的事情是,TreeView 维护一个 TreeViewItems 的内部列表,每个列表都有一个 IsSelected 标志(在 MVVM 应用中,您可以将这些项绑定到其相应视图模型中的属性)。刷新排序列表时,TreeView 通过从头开始为相关子树重新创建 TreeViewItems 来响应。当前选择的 TreeViewItem 与 TreeView 分离,因此框架通过选择父节点(即 Quest)来响应。通常,您可以调用 treeview.ItemContainerGenerator.ContainerFromItem(item) 从项中获取新的 TreeView,但由于在运行时创建节点的动态方式,这不适用于 HierarchicalDataTemplates。诀窍是手动遍历 TreeView 的层次结构,查找具有所选值的节点。

下面是新代码:

public interface INameable
{
    string Name { get; set; }
}
public class Quest : ViewModelBase, INameable
{
    private string _name;
    public string Name
    {
        get { return _name; }
        set
        {
            _name = value;
            RaisePropertyChanged();
        }
    }
    private ObservableCollection<Dialogue> _Dialogues;
    public ObservableCollection<Dialogue> Dialogues
    {
        get { return this._Dialogues; }
        set { this._Dialogues = value; RaisePropertyChanged(); }
    }
    private ICollectionView _SortedDialogues;
    public ICollectionView SortedDialogues
    {
        get { return this._SortedDialogues; }
        set { this._SortedDialogues = value; RaisePropertyChanged(); }
    }
    // this is actually a bit messy, I'll leave it to you to find a cleaner way of doing this
    public Func<object> GetSelected;
    public Action<object> SetSelected;
    public Quest()
    {
        Dialogues = new ObservableCollection<Dialogue>();
        this.SortedDialogues = CollectionViewSource.GetDefaultView(Dialogues);
        this.SortedDialogues.SortDescriptions.Add(new SortDescription("Name", ListSortDirection.Ascending));
    }
    public void AddDialogue(Dialogue dlg)
    {
        this.Dialogues.Add(dlg);
        dlg.PropertyChanged += Dlg_PropertyChanged;
        SortDialogues();
    }
    private void Dlg_PropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        SortDialogues();
    }
    private void SortDialogues()
    {
        var selected = GetSelected(); // get currently selected item
        this.SortedDialogues.Refresh(); // bam! treeviewitmes get destroyed.
        SetSelected(selected); // so reselect it immediately
    }
}
public class Dialogue : ViewModelBase, INameable
{
    private string _name;
    public string Name
    {
        get { return _name; }
        set
        {
            _name = value;
            RaisePropertyChanged();
        }
    }
}
public partial class MainWindow : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    private object _selectedObject = new object();
    public object SelectedObject
    {
        get
        {
            return _selectedObject;
        }
        set
        {
            _selectedObject = value;
            OnPropertyChanged();
        }
    }
    public ObservableCollection<Quest> Quests
    {
        get { return _quests; }
        set
        {
            _quests = value;
            OnPropertyChanged();
        }
    }
    private ObservableCollection<Quest> _quests;        
    public MainWindow()
    {
        Quests = new ObservableCollection<Quest>();
        InitializeComponent();
    }
    private void AddQuest(object sender, RoutedEventArgs e)
    {
        Quests.Add(new Quest
        {
            Name = "Quest",
            GetSelected = () => this.SelectedObject,
            SetSelected = (selected) => {
                ItemContainerGenerator gen = _treeView.ItemContainerGenerator;
                TreeViewItem item = ContainerFromItem(gen, selected);
                if (item != null)
                    item.IsSelected = true;
            }
            ,
        });
    }
    private void AddDialogue(object sender, RoutedEventArgs e)
    {
        if (_treeView.SelectedItem is Quest)
        {
            var dlg = new Dialogue
            {
                Name = "Dialogue"
            };
            (_treeView.SelectedItem as Quest).AddDialogue(dlg);
        }
    }
    // courtesy http://stackoverflow.com/questions/24859511/get-treeviewitem-for-treeview-logical-element
    private static TreeViewItem ContainerFromItem(ItemContainerGenerator containerGenerator, object item)
    {
        TreeViewItem container = (TreeViewItem)containerGenerator.ContainerFromItem(item);
        if (container != null)
            return container;
        foreach (object childItem in containerGenerator.Items)
        {
            TreeViewItem parent = containerGenerator.ContainerFromItem(childItem) as TreeViewItem;
            if (parent == null)
                continue;
            container = parent.ItemContainerGenerator.ContainerFromItem(item) as TreeViewItem;
            if (container != null)
                return container;
            container = ContainerFromItem(parent.ItemContainerGenerator, item);
            if (container != null)
                return container;
        }
        return null;
    }
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

下面是树视图的 XAML:

    <TreeView x:Name="_treeView" behaviors:TreeViewHelper.SelectedItem="{Binding Path=SelectedObject, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
        <TreeViewItem IsExpanded="True">
            <TreeViewItem.Header>
                <TextBlock Text="Project" Margin="5,0,0,0" />
            </TreeViewItem.Header>
            <TreeViewItem ItemsSource="{Binding Quests}" IsExpanded="True">
                <TreeViewItem.Header>
                    <TextBlock Text="Quests" Margin="5,0,0,0" />
                </TreeViewItem.Header>
                <TreeViewItem.Resources>
                    <HierarchicalDataTemplate DataType="{x:Type testApplication:Quest}" ItemsSource="{Binding SortedDialogues, UpdateSourceTrigger=PropertyChanged}">
                        <TextBlock Text="{Binding Name}" Margin="5,0,0,0" />
                    </HierarchicalDataTemplate>
                    <DataTemplate DataType="{x:Type testApplication:Dialogue}">
                        <TextBlock Text="{Binding Name}" Margin="5,0,0,0" />
                    </DataTemplate>
                </TreeViewItem.Resources>
            </TreeViewItem>
        </TreeViewItem>
    </TreeView>

最后是绑定当前选定项目的行为,它以各种形式存在于网络上,所以我不知道它最初来自哪里:

public class TreeViewHelper
{
    private static Dictionary<DependencyObject, TreeViewSelectedItemBehavior> behaviors = new Dictionary<DependencyObject, TreeViewSelectedItemBehavior>();
    public static object GetSelectedItem(DependencyObject obj)
    {
        return (object)obj.GetValue(SelectedItemProperty);
    }
    public static void SetSelectedItem(DependencyObject obj, object value)
    {
        obj.SetValue(SelectedItemProperty, value);
    }
    // Using a DependencyProperty as the backing store for SelectedItem.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty SelectedItemProperty =
        DependencyProperty.RegisterAttached("SelectedItem", typeof(object), typeof(TreeViewHelper), new UIPropertyMetadata(null, SelectedItemChanged));
    private static void SelectedItemChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
    {
        if (!(obj is TreeView))
            return;
        if (!behaviors.ContainsKey(obj))
            behaviors.Add(obj, new TreeViewSelectedItemBehavior(obj as TreeView));
        TreeViewSelectedItemBehavior view = behaviors[obj];
        view.ChangeSelectedItem(e.NewValue);
    }
    private class TreeViewSelectedItemBehavior
    {
        TreeView view;
        public TreeViewSelectedItemBehavior(TreeView view)
        {
            this.view = view;
            view.SelectedItemChanged += (sender, e) => SetSelectedItem(view, e.NewValue);
        }
        internal void ChangeSelectedItem(object p)
        {
            TreeViewItem item = (TreeViewItem)view.ItemContainerGenerator.ContainerFromItem(p);
            // item will be null for HierarchicalDataTemplates
            if (item != null)
                item.IsSelected = true;
        }
    }
}