wpf - 在 WPF MVVM 中动态添加控件

Question

我正在开发一个动态搜索视图，其中单击一个按钮应添加一个包含 3 个组合框和 2 个文本框的新行。

我该怎么做呢？

Answer 1

如果您真的想做 mvvm ，请尝试忘记“如何添加控件”。您不必这样做，只需考虑您的视图模型 - WPF 为您创建控制 :)

在您的情况下，假设我们有一个 SearchViewModel 和一个 SearchEntryViewmodel。

public class SearchEntryViewmodel
{
    //Properties for Binding to Combobox and Textbox goes here
}


public class SearchViewModel 
{
    public ObservableCollection<SearchEntryViewmodel> MySearchItems {get;set;}
    public ICommand AddSearchItem {get;}
}

到目前为止，您不必考虑用户控件/视图。在您的中SearchView，您创建一个ItemsControl并将其绑定ItemsSource到MySearchItems.

<ItemsControl ItemsSource="{Binding MySearchItems}"/> 

你现在看到你SearchEntryViewmodels在ItemsControl(just the ToString() atm).

为了满足您使用 3Comboboxes 等显示每个 SearchEntryViewmodel 的要求，您只需在资源中定义一个 DataTemplate

<DataTemplate DataType="{x:Type local:SearchEntryViewmodel}">
    <StackPanel Orientation="Horizontal">
        <Combobox ItemsSource="{Binding MyPropertyInSearchEntryViewmodel}"/>
        <!-- the other controls with bindings -->
    </StackPanel>
</DataTemplate>

就是这样 :) 而且您永远不必考虑“如何动态添加控件？”。您只需将新的添加SearchEntryViewmodel到您的收藏中。

这种方法称为Viewmodel First，我认为这是执行 MVVM 的最简单方法。

Answer 2

一种选择是您可以通过创建新实例在后端创建文本框和组合框。但更好的选择是您可以创建一个用户控件，其中包含您要添加的所有 texbox 和组合框以及您想要的格式。在按下按钮时创建后，您可以创建此用户控件的实例，并使用控件的SetValue属性将其设置在网格或任何其他控件中。

如果您不熟悉 WPF 和 MVVM，请阅读此博客以了解这一点。

https://radhikakhacharia.wordpress.com/2012/06/01/wpf-tutorial-3/

https://radhikakhacharia.wordpress.com/2012/02/13/model-view-viewmodel/

Answer 3

如果您是 MVVM 和 WPF 的新手，Jason Dollinger 提供了一个非常精彩的视频教程，介绍如何构建 C# / WPF / MVVM 应用程序，可在 lab49 上找到。他在这段精彩视频中开发的所有源代码也可以在 lab49 上找到。

看完之后，你肯定不会有任何问题来开发你的搜索视图。