WPF: просмотр с несколькими подпредставлениями
Я пытаюсь собрать элемент управления в WPF, который имеет дочерние представления.
Количество дочерних просмотров (может увеличиваться или уменьшаться) от 1 до 10. И мне бы хотелось, чтобы основной вид это показывал.
Если возможно, я хотел бы избежать необходимости жестко кодировать каждое представление в файле xaml. Вместо этого я бы хотел, чтобы это было динамично. Я следую шаблону MVVM и хотел бы, чтобы количество представлений соответствовало количеству дочерних моделей представлений в родительской модели представления.
Модели представления тоже выглядят похоже (я упростил код).
public class ParentViewModel : ObservableObject
{
public List<ChildViewModel> Children { get; set; }
}
public class ChildViewModel
{
}
Xaml, которого я хотел бы избежать:
<Grid>
<views:ChildView DataContext = "{Binding Children[0]}"/>
<views:ChildView DataContext = "{Binding Children[1]}"/>
<views:ChildView DataContext = "{Binding Children[2]}"/>
... ect
</Grid>
Я знаю, что некоторые другие элементы управления в wpf имеют ItemsSource, к которому вы можете привязать список в ViewModels.
Я просто не уверен, как это будет выглядеть, и изо всех сил пытаюсь найти примеры.
Ответы 2
Вы всегда можете использовать ListBox, чтобы представить список объектов. Свойство ItemTemplate определяет, как на самом деле отображаются элементы данных:
<ListBox ItemsSource = "{Binding Children}">
<!-- Only use the following ItemContainerStyle to remove the listbox look and feel -->
<ListBox.ItemContainerStyle>
<Style TargetType = "ListBoxItem">
<Setter Property = "Template">
<Setter.Value>
<ControlTemplate TargetType=ListBoxItem">
<ContentPresenter />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate DataType = "ChildViewModel">
<views:ChildView />
</DataContext>
</ListBox.ItemTemplate>
</ListBox>
Самый простой элемент управления для отображения динамической коллекции элементов представления — это ItemsControl.
Используя свою модель представления, вы должны написать что-то вроде показанного ниже, где ваш ChildView объявлен в файле ItemTemplate. DataContext каждого ChildView автоматически присваивается соответствующему элементу коллекции Children.
<ItemsControl ItemsSource = "{Binding Children}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<views:ChildView/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
Панель по умолчанию, используемая ItemsControl, представляет собой вертикальную StackPanel. Вы можете изменить это, установив для свойства ItemsPanel значение ItemsPanelTemplate с другой панелью. Типичными панелями являются горизонтальные StackPanel, WrapPanel и UniformGrid. Сетка также возможна, но вам потребуются свойства модели представления для строки и столбца каждого элемента.
<ItemsControl ItemsSource = "{Binding Children}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<views:ChildView/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
Используйте ItemsControl.