动态添加用户控件

Question

我正在尝试通过按下按钮将用户控件动态添加到 ItemsControl。用户控件有一个与之关联的视图模型。 UI 正在使用实例化视图模型的值进行更新。

我的属性是这样定义的：

private ObservableCollection<StageControlViewModel> _stages = new ObservableCollection<StageControlViewModel>();

public ObservableCollection<StageControlViewModel> Stages
{
    get => _stages;
    set => SetProperty(ref _stages, value);
}

我在 xaml 设置中有以下绑定：

<ItemsControl ItemsSource="{Binding Stages}">
    <ItemsControl.ItemTemplate>
        <DataTemplate DataType="{x:Type viewModels:StageControlViewModel}">
            <views:StageControl/>
        </DataTemplate>
     </ItemsControl.ItemTemplate>
</ItemsControl>

我添加了这个功能：

private void AddStage()
{
    StageControlViewModel viewModel = new StageControlViewModel
    {
        Name = ("Stage " + (_stages.Count + 1)),
        TimeToNextStage = 106
    };

    Stages.Add(viewModel);
}

用户控件的绑定是使用以下代码设置的：

<UserControl.DataContext>
    <viewModels:StageControlViewModel/>
</UserControl.DataContext>

视图模型继承自 ObservableObject。

现在我遇到的问题是，当我添加控件时，值的绑定不起作用。 IE - Name 和 TimeToNextStage 没有更新 UI。不确定我在这里做错了什么，我们将不胜感激。提前致谢。

Answer 1

从 UserControl 的 XAML 中删除 DataContext 分配：

<UserControl.DataContext>
    <viewModels:StageControlViewModel/>
</UserControl.DataContext>

写的时候

<ItemsControl.ItemTemplate>
    <DataTemplate>
        <views:StageControl/>
    </DataTemplate>
 </ItemsControl.ItemTemplate>

StageControl 的 DataContext 值应该继承自 item 容器，一个应用 DataTemplate 的 ContentPresenter。继承的 DataContext 包含对 ItemsSource 集合的关联元素的引用。

当您显式分配 UserControl 的 DataContext 时，继承被破坏并且控件未绑定到 ItemsSource 集合元素。

动态添加用户控件

Dynamically Add a User Control

wpf

mvvm