【问题标题】:WPF MVVM dynamic collection of user controls in a wrap panel环绕面板中用户控件的 WPF MVVM 动态集合
【发布时间】:2012-04-08 14:03:12
【问题描述】:

我是 WPF 新手,但我创建了一个带有包装面板的窗口,该面板包含一组从后面的代码动态添加的用户控件实例。每个用户控件最终将显示从数据库调用返回的行中的数据。我想让它遵循 MVVM,但在架构上有点卡住。我想我需要有一个用户控件的视图模型和一个窗口的视图模型,它将拥有用户控件视图模型的 observablecollection。如何将其绑定到视图侧的包装面板,以便包装面板看到用户控件视图模型的集合并知道为集合中的每个实例建立用户控件?

我认为一旦这一切都正确绑定,我可以创建一个后台工作人员,定期查询数据库并创建/更新用户控件视图模型对象,如果我从 INotifyPropertyChanged 继承并在我的用户中触发属性更改事件控制视图模型的一切都应该基于绑定进行更新。这听起来正确吗?

我见过一些基本示例,例如绑定到列表框的可观察字符串集合,但我无法将其应用于更复杂的情况。任何关于一般架构或我应该从哪里开始的建议都非常感谢!

【问题讨论】:

    标签: wpf mvvm


    【解决方案1】:

    基本上,您需要一个可枚举控件,该控件为 ObservableCollection 中的每个元素都有一个项目。控件的项目将需要模板化以使用您的自定义控件显示数据

    为此,请创建一个 ObservableCollection 来保存您的数据对象并将其用作 ListBox 的 ItemsSource。然后需要更改 ListBox 以在 WrapPanel 而不是默认布局中显示其项目。修改 ListBox 的 ItemTemplate 以对每个列表项使用您的自定义用户控件。

    视图模型:

    public class WindowViewModel
    {
         public ObservableCollection<MyDatabaseObject> DatabaseObjects { get; set; }
    }
    
    
    public class MyDatabaseObject : INotifyPropertyChanged
    {
         public event PropertyChangedEventHandler PropertyChanged;
    
         public string DbName 
         { 
             get { return _dbName; }
             set { 
                    _dbName = value;
                    if (PropertyChanged != null)
                        PropertyChanged(this, new PropertyChangedEventArgs("dbName");
             } 
         }
    
         private _dbName;
    }
    

    Xaml:

     <Grid>
        <ListBox ItemsSource="{Binding DatabaseObjects}">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel/>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <MyUserControl Title="{Binding DbName}"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
    

    【讨论】:

    • 谢谢 - ObservableCollection 和 DataTemplate 是我所缺少的拼图
    • @jav1981 如果您收到满意的答复,请接受。
    【解决方案2】:

    您在寻找ItemsControl 课程吗?将 ItemsControl.ItemTemplate 设置为您的 ItemUserControlViewModel 的 DataTemplate(-> 项目用户控件视图)。并将ItemsControl.ItemsPanel 设置为ItemsPanelTemplateWrapPanel

    ItemControl 的ItemsSource 属性将从WindowViewModel 绑定到您的ObservableCollection&lt;ItemUserControlViewModel&gt;

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-08-08
      • 1970-01-01
      • 2011-07-13
      • 1970-01-01
      • 1970-01-01
      • 2011-04-25
      相关资源
      最近更新 更多