XAML Привязка данных в вложенной сетке

Question

Я создал вложенную сетку в XAML, который в настоящее время выглядит следующим образом:

<Grid x:Name="mainGrid" >   
    <Grid.RowDefinitions> 
     <RowDefinition/> 
     <RowDefinition/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition/> 
     <ColumnDefinition/> 
    </Grid.ColumnDefinitions> 

    <Grid Grid.Row="{Binding Row}" Grid.Column="{Binding Col}"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="0.1*"/> 
      <RowDefinition/> 
     </Grid.RowDefinitions> 
     <TextBlock Text="{Binding Title}" VerticalAlignment="Bottom" HorizontalAlignment="Center" Grid.Row="0" FontWeight="Bold" TextDecorations="Underline"/> 
     <ListView ItemsSource="{Binding Names}" Grid.Row="1"/> 
    </Grid> 

</Grid> 

Моя цель состоит, чтобы заполнить 4 Grids, которые следуют шаблон внутренней Grid. Я попытался это, используя следующий код позади:

List<Test> tests = new List<Test>(); 

for (int i = 0; i < 2; i++) 
{ 
    for (int j = 0; j < 2; j++) 
    { 
      Test t = new Test(); 
      t.Title = i + "\t" + j; 
      t.Row = i; 
      t.Col = j; 
      tests.Add(t); 
    } 
} 

mainGrid.DataContext = tests; 

и определение класса:

class Test 
{ 
    public string Title { get; set; } 
    public int Row { get; set; } 
    public int Col { get; set; } 
    public ObservableCollection<string> Names 
    { 
     get 
     { 
      return new ObservableCollection<string>() { "A", "B", "C", "D", "E", "F", "G", "H", "I", "J"}; 
     } 
    } 
} 

Мои мысли здесь были, что я должен был бы 4 объекта с определениями/Col Row для каждого сегмента внешнее определение Grid (0,0 & 0,1 & 1,0 & 1,1). Внутренний Grid будет служить шаблоном, как ItemTemplate в ListView. Однако заполняется только верхний (0,0) Grid.

Какие шаги следует предпринять, чтобы внутренний Grid вел себя как шаблон и все 4 Grids созданы и заполнены?

Answer 1

Использование ItemsControl, где ItemsSource список Test и заполнить ItemsPanel с наружным Grid и ItemTemplate с внутренней Grid

<ItemsControl ItemsSource="{Binding}"> 
    <ItemsControl.ItemsPanel> 
     <ItemsPanelTemplate> 
      <Grid> 
       <Grid.RowDefinitions> 
        <RowDefinition/> 
        <RowDefinition/> 
       </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition/> 
        <ColumnDefinition/> 
       </Grid.ColumnDefinitions> 
      </Grid> 
     </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
    <ItemsControl.ItemContainerStyle> 
     <Style TargetType="{x:Type ContentPresenter}"> 
      <Setter Property="Grid.Row" Value="{Binding Row}"/> 
      <Setter Property="Grid.Column" Value="{Binding Col}"/> 
     </Style> 
    </ItemsControl.ItemContainerStyle> 
    <ItemsControl.ItemTemplate> 
     <DataTemplate> 
      <Grid> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="0.1*"/> 
        <RowDefinition/> 
       </Grid.RowDefinitions> 
       <TextBlock Text="{Binding Title}" VerticalAlignment="Bottom" HorizontalAlignment="Center" Grid.Row="0" FontWeight="Bold" TextDecorations="Underline"/> 
       <ListView ItemsSource="{Binding Names}" Grid.Row="1"/> 
      </Grid> 
     </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl> 

и потому, что ItemsControl будет обернуть элемент в ContentPresenter вам нужно переместить Grid.Column и Grid.Row привязок ItemContainerStyle

EDIT

ItemsControl - самый простой элемент управления для отображения списка чего-либо. Элементы управления, такие как ListBox, ListView, ComboBox, DataGrid и даже MenuItem, все они наследуют от ItemsControl, добавляя больше функциональности сверху, например, выбор или представление столбца.

ItemsPanel определяет, как будет выглядеть контейнер общих предметов, а ItemTemplate определяет, как будет выглядеть каждый элемент в коллекции.

У каждого ItemsControl будет свой тип контейнера для предметов. Для ListBox это будет ListBoxItem, для ListView будет ListViewItem и так далее и для ItemsControl это ContentPresenter. Это просто визуальный контейнер, где каждый элемент списка помещается как контент, а затем - согласно иерархии MSDN: Remarks section - преобразуется в визуальный. В визуальном дереве этот контейнер является прямым дочерним элементом панели элементов, поэтому список предметов Grid.Column и/или Grid.Row должен быть установлен против него. Также, например, для ListBox это ListBoxItem, что содержит IsSelected. И способ изменить этот контейнер или получить данные из контейнера через ItemContainerStyle.