使用C# WPF过滤控件列表

Question

有人尝试过筛选控件列表吗？我有一些简单的样例代码，可以说明一个问题，但我似乎无法解决。当筛选文本列表时，我没有任何问题，但当我将列表转换为可观察控件列表时，运行任何筛选都会影响其他筛选器。以下是一些有效的示例代码：

代码：

public partial class MainWindow : Window
{
    public ObservableCollection<string> testOC { get; set; }
    public MainWindow()
    {
        InitializeComponent();

        testOC = new ObservableCollection<string>();

        for (int i = 0; i < 20; i++)
        {
            testOC.Add("Test Stuff " + i);
        }

        ListCollectionView view1 = new ListCollectionView(testOC);
        ListCollectionView view2 = new ListCollectionView(testOC);
        view1.Filter = Filter1;
        view2.Filter = Filter2;
        leftGrid.ItemsSource = testOC;
        MiddleGrid.ItemsSource = view1;
        rightGrid.ItemsSource = view2;
    }

    private bool Filter1(object test)
    {
        try
        {
            var testStuff = test as string;

            if (testStuff.Contains("1"))
            {
                return true;
            }
            return false;
        }
        catch (Exception)
        {
            throw;
        }
    }
    private bool Filter2(object test)
    {
        try
        {
            var testStuff = test as string;

            if (testStuff.Contains("2"))
            {
                return true;
            }
            return false;
        }
        catch (Exception)
        {
            throw;
        }
    }
}

XML:

<Window x:Class="testTheFilter.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:testTheFilter"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="150"/>
        <ColumnDefinition Width="150"/>
        <ColumnDefinition Width="150"/>
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="25"/>
        <RowDefinition Height="775"/>
    </Grid.RowDefinitions>
    <ItemsControl Name="leftGrid" Grid.Column="0" Grid.RowSpan="2"/>
    <ItemsControl Name="MiddleGrid" Grid.Column="1" Grid.RowSpan="2"/>
    <ItemsControl Name="rightGrid" Grid.Column="2" Grid.RowSpan="2"/>
</Grid>

代码工作截图：

这段代码可以正常工作，你会得到三个列表，第一个列表包含所有字符串，第二个列表只包含带有1的字符串，第三个列表只包含带有2的字符串。

现在，如果我将完全相同的代码更改为控件列表，则会出现问题。

这是代码的一部分：

public partial class MainWindow : Window
{
    public ObservableCollection<Button> testOC { get; set; }
    public MainWindow()
    {
        InitializeComponent();

        testOC = new ObservableCollection<Button>();

        for (int i = 0; i < 20; i++)
        {
            Button btn = new Button();
            btn.Content = "Test Stuff " + i;
            testOC.Add(btn);
        }

        ListCollectionView view1 = new ListCollectionView(testOC);
        ListCollectionView view2 = new ListCollectionView(testOC);
        view1.Filter = Filter1;
        view2.Filter = Filter2;
        leftGrid.ItemsSource = testOC;
        MiddleGrid.ItemsSource = view1;
        rightGrid.ItemsSource = view2;
    }

    private bool Filter1(object test)
    {
        try
        {
            var testStuff = test as Button;

            if (testStuff.Content.ToString().Contains("1"))
            {
                return true;
            }
            return false;
        }
        catch (Exception)
        {
            throw;
        }
    }
    private bool Filter2(object test)
    {
        try
        {
            var testStuff = test as Button;

            if (testStuff.Content.ToString().Contains("2"))
            {
                return true;
            }
            return false;
        }
        catch (Exception)
        {
            throw;
        }
    }
}

下面是代码无法正常运行的截图：

有人遇到过这种情况吗？如何解决？我已经花了几个小时来研究它，但似乎找不到解决方法。

谢谢提前。

- Matthew

---

我想这是因为一个可视元素不能同时作为多个父级元素的子级（正如您在第二个示例中看到的所有按钮都是唯一的）。您真的需要在代码中实现吗？DataTemplate 可以成为此处的工具。 - icebat

我对DataTemplates不是很了解...我想现在是一个好时机去研究一下。我创建这个程序的原因是，我的部门监控我们在任务计划程序中创建的系统任务。我创建了用户控件来可视化表示这些任务。我有4列要显示，取决于用户选择的视图。其中一个显示所有任务，一个显示错误的任务，一个显示禁用的任务，还有一个显示正在运行或活动的任务。不确定这是否能让你明白我在做什么。 - Matthew

我继续研究这个问题，但似乎没有看到如何解决它...我会继续寻找，但如果有人有解决方案或想法，请随时分享。 - Matthew

我仍然不知道为什么你需要在这里使用按钮，但数据模板正是为了改变数据的可视化表示而创建的。 - icebat

Answer 1

由于无法将一个视觉元素（按钮）同时添加到不同的父对象中，为什么不使用DataTemplates？如果你保留第一个示例中的代码，只需编辑XAML即可：

<Grid>
    <Grid.Resources>
        <DataTemplate x:Key="itemTemplate">
            <Button>
                <ContentPresenter Content="{Binding}" />
            </Button>
        </DataTemplate>
    </Grid.Resources>

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="150"/>
        <ColumnDefinition Width="150"/>
        <ColumnDefinition Width="150"/>
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="25"/>
        <RowDefinition Height="775"/>
    </Grid.RowDefinitions>
    <ItemsControl Name="leftGrid" Grid.Column="0" Grid.RowSpan="2" ItemTemplate="{StaticResource itemTemplate}" />
    <ItemsControl Name="MiddleGrid" Grid.Column="1" Grid.RowSpan="2" ItemTemplate="{StaticResource itemTemplate}" />
    <ItemsControl Name="rightGrid" Grid.Column="2" Grid.RowSpan="2" ItemTemplate="{StaticResource itemTemplate}" />
</Grid>

- icebat

---

这个例子是关键。我还有很多工作要做，将用户控件中的数据绑定到数据模板，但这解决了我的问题。谢谢！ - Matthew

Answer 2

就像icebat所说的那样，一个可视元素不能成为多个父级的子级。按钮是一个可视元素 - 字符串不是。如果您将代码更改为以下内容，则可以获得所需的结果：

    public ObservableCollection<Button> testOC { get; set; }
    public ObservableCollection<Button> testOC1 { get; set; }
    public ObservableCollection<Button> testOC2 { get; set; }

    public MainWindow()
    {
        InitializeComponent();

        testOC = new ObservableCollection<Button>();
        testOC1 = new ObservableCollection<Button>();
        testOC2 = new ObservableCollection<Button>();

        for (int i = 0; i < 20; i++)
        {
            var content = "Test Stuff " + i;

            Button btn = new Button();
            btn.Content = content;
            testOC.Add(btn);

            Button btn1 = new Button();
            btn1.Content = content;
            testOC1.Add(btn1);

            Button btn2 = new Button();
            btn2.Content = content;
            testOC2.Add(btn2);
        }

        ListCollectionView view1 = new ListCollectionView(testOC1);
        ListCollectionView view2 = new ListCollectionView(testOC2);
        view1.Filter = Filter1;
        view2.Filter = Filter2;
        leftGrid.ItemsSource = testOC;
        MiddleGrid.ItemsSource = view1;
        rightGrid.ItemsSource = view2;
    }

- Jacob Shanley