首页 > 解决方案 > 如何使用 MVVM 模式将子元素添加到 WPF 中的网格

问题描述

我正在尝试通过绑定 mvvm 模式而不是后面的代码来将一个子元素添加到 Grid 控件。

查看代码:

<Grid  Name="grid">

</Grid>

后面的代码:

    public MainWindow()
    {
        InitializeComponent();
        AddControl();
    }

    private void AddControl()
    {
        Viewer viewer = new Viewer();
        grid.Children.Add(viewer.GetUIElement());
    }

上面的代码工作正常,但我想通过绑定而不是后面的代码在 VM 中执行此操作。请注意,在上面的代码中,Viewer 是第三方控件,它通过后面的代码完美地添加到网格中。我想使用绑定动态地将查看器控件添加到网格中。

并不总是需要在那里有一个 Grid 控件。它可以是任何控件,例如父/托管/内容控件。只有一个子控件是 Viewer。

我对 ICommand、INotifyPropertyChanged、Dependency Property 等绑定有基本的了解,但现在知道如何将任何控件(在我的情况下为查看器)添加到另一个父控件(在我的情况下为网格)。

代码可能如下: View and VM is bound through DataContext

查看代码:

<ContentControl Content="{Binding MyControl}"></ContentControl>

虚拟机代码:

class VM
{
    Viewer view;
    public VM()
    {
        view = new Viewer();
    }
    public Viewer MyControl
    {
        get {return view; }
        set{view= value;}
    }
}

标签: c#wpfmvvm

解决方案


我不确定您为什么要拥有网格,甚至动态添加查看器的任何内容。

如果这只是一个子项并且可以是不同的东西,那么您可以用内容控件替换网格。

将其内容属性绑定到窗口视图模型中的属性。将视图模型和数据模板切换到 ui 中。

这种方法首先称为视图模型,通常用于导航。

一些代码说明了它是如何工作的:

https://social.technet.microsoft.com/wiki/contents/articles/52485.wpf-tips-and-tricks-using-contentcontrol-instead-of-frame-and-page-for-navigation.aspx

定义数据模板:

<Window.Resources>
   <DataTemplate DataType="{x:Type local:LoginViewModel}">
      <local:LoginUC/>
   </DataTemplate>
   <DataTemplate DataType="{x:Type local:UserViewModel}">
      <local:UserUC/>
  </DataTemplate>
</Window.Resources>

每当您为 UI 提供一个 LoginViewModel 实例时,该实例将被模板化到 LoginUC 中,该 LoginViewModel 实例作为数据上下文。类似地,UserViewModel 在视图中为您提供了一个 UserUC。

绑定内容控件的内容:

 <ContentControl Content="{Binding CurrentViewModel}" />

在窗口的视图模型中,我有一个属性 CurrentViewModel。该示例将其设置为要导航的其中一个视图模型的实例。


推荐阅读