c# - 如何处理 MVVM (WPF) 中的多个复选框？

Question

我有一个扩展列表，每个扩展都有自己的复选框，用户需要从中进行选择:

最后，我需要一个包含所有所选扩展的列表或 ObservableCollection。

执行此非 MVVM 非常简单。我创建了 Checked 或 Unchecked 事件，并添加了发件人的内容。

查看:

<CheckBox Checked="ToggleButton_OnChecked" Unchecked="ToggleButton_OnUnchecked">exe</CheckBox>

代码隐藏:

    private void ToggleButton_OnChecked(object sender, RoutedEventArgs e)
    {
        var ext = ((CheckBox) sender).Content.ToString();
        Model.FirstRun.ExcludeExt.Add(ext);
    }

    private void ToggleButton_OnUnchecked(object sender, RoutedEventArgs e)
    {
        var ext = ((CheckBox)sender).Content.ToString();
        Model.FirstRun.ExcludeExt.Remove(ext);
    }

如果我想采用这种 MVVM 风格，据我所知，我必须为每个复选框创建一个属性并将它们绑定(bind)到 UI。这是很多工作。

有没有更简单的方法？

Answer 1

您应该首先考虑一个结构，然后它就不是那么多工作并且可以非常直接地使用。

例如:您有一组分机。我会创建这样的想法(只是伪代码；例如，没有实现 INotifyPropertyChanged)。

public class ExtensionGroup
{
    public string Name {get; set;}
    public ObservableCollection<ExtensionInfo> ExtensionInfos {get; set;}
}

public class ExtensionInfo
{
    public string Extension {get; set;}
    public bool IsChecked {get; set;}

    public ExtensionInfo(string extension)
    {
        Extension = extension;
    }
}

并且在您的 ViewModel 中您可以创建

public ObservableCollection<ExtensionGroup> ExtensionGroups {get; set;}

现在你必须像这样添加数据

var extensionGroup = new ExtensionGroup{Name = "Executables"};
extensionGroup.ExtensionInfos.Add(new ExtensionInfo("exe");
extensionGroup.ExtensionInfos.Add(new ExtensionInfo("bat");

然后您将得到一个包含所有组(包括扩展)的列表。

在您的 View 中，您可以绑定(bind)这些数据，然后就完成了。对于 View ，您可以使用带有 DataTemplate 或其他一些项目控件的 ListView。

使用更少的代码，您的 View 将变得更加容易，因为您只需指定一次布局。

/编辑这是 xaml 的示例实现。我使用了 ItemsControl 而不是 ListView。

<ItemsControl ItemsSource="{Binding ExtensionGroups}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <Label Content="{Binding Name}"/>
                <ItemsControl ItemsSource="{Binding ExtensionInfos}">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <WrapPanel />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <CheckBox IsChecked="{Binding IsChecked}"
                                      Content="{Binding Extension}"/>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </StackPanel>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

看起来像这样(只是添加了两个带有两个扩展名的组)。