WPF MVVM динамическая коллекция пользовательских элементов управления в панели обертывания

Question

Я новичок в WPF, но создал окно с панелью обертки, которое содержит коллекцию экземпляров пользовательского элемента управления, динамически добавленных из кода позади. Каждый пользовательский элемент управления в конечном счете отображает данные из строки, возвращаемой из вызова базы данных. Я хотел бы сделать это после MVVM, но я немного застрял в архитектуре. Я думаю, мне нужно иметь модель представления для пользовательского элемента управления и модель представления для окна, которое будет обладать наблюдаемым набором моделей пользовательского контроля. Как я могу привязать его к панели обтекания на стороне представления, чтобы панель обхода увидела коллекцию моделей управления пользовательским контролем и знает, чтобы установить пользовательский элемент управления для каждого экземпляра в коллекции?

Я думаю, что после того, как все это правильно связано, я могу сделать фонового работника, который с регулярным интервалом запрашивает базу данных и создает/обновляет объекты модели управления пользовательским объектом, и если я наследую от INotifyPropertyChanged и меняю свойство измененных событий в моем модель управления пользовательским контролем все должно обновляться на основе привязки. Правильно ли это звучит?

Я видел основные примеры, такие как наблюдаемое объединение строк, связанных с полем списка, но у меня возникли проблемы с применением этого в более сложном случае. Любые предложения относительно общей архитектуры или того, с чего я должен начать работать, очень ценятся!

Answer 1

Вы ищете класс ItemsControl? С ItemsControl.ItemTemplate установите для DataTemplate для элемента ItemUserControlViewModel (-> элемент управления пользователем). И ItemsControl.ItemsPanel установлен на ItemsPanelTemplate с WrapPanel.

Свойство объекта ItemsSource ItemControl будет привязано к вашему ObservableCollection<ItemUserControlViewModel> от WindowViewModel.

Answer 2

В принципе, вам нужен перечислимый элемент управления, который имеет один элемент для каждого элемента вашего ObservableCollection. Элементы элемента управления должны быть настроены для отображения данных с использованием настраиваемого элемента управления.

Для этого создайте ObservableCollection, который хранит ваши объекты данных и использует его как ItemsSource для ListBox. Затем ListBox необходимо будет изменить, чтобы отображать его элементы в WrapPanel вместо макета по умолчанию. Измените ItemTemplate в ListBox, чтобы использовать свой пользовательский элемент управления для каждого элемента списка.

ViewModel:

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>