嵌套網格中的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>

我的目標是填充遵循內部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個對象，其中包含外部Grid定義（0,0＆0,1和1,0和1,1）的每個段的行/列定義。 內部Grid將像ListView的ItemTemplate一樣充當模板。 但是只填充頂部（0,0） Grid 。

我應該采取哪些步驟，以便內部Grid像模板一樣，並且所有4個Grids都被創建和填充？

Answer 1

使用ItemsControl ，其中ItemsSource是Test的列表，並使用外部Grid填充ItemsPanel ，使用內部Grid填充ItemTemplate

<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

編輯

ItemsControl是顯示某些內容列表的最基本控件。 像ListBox ， ListView ， ComboBox ， DataGrid甚至MenuItem這樣的ListBox它們都繼承自ItemsControl在頂部添加了更多功能，如選擇或列視圖。

ItemsPanel定義了常規項容器的外觀， ItemTemplate定義了集合中每個項目的外觀。

每個ItemsControl都有其項容器類型。 對於ListBox ，它將是ListBoxItem ，對於ListView ，它將是ListViewItem ，依此類推，對於ItemsControl它是ContentPresenter 。 它只是一個可視容器，其中列表的每個項目都作為內容放置，然后 - 根據層次結構MSDN：備注部分 - 轉換為可視化。 在可視樹中，此容器是items面板的直接子項，因此必須根據它設置Grid.Column和/或Grid.Row列表。 另外，例如對於ListBox它是包含IsSelected屬性的ListBoxItem 。 更改容器或獲取容器數據的方法是通過ItemContainerStyle 。