ObservableCollection 的 ObservableCollection 的网格答案

【问题标题】：Grid of ObservableCollection of ObservableCollectionObservableCollection 的 ObservableCollection 的网格
【发布时间】：2012-05-05 15:47:01
【问题描述】：

这是一个有趣的案例，我无法在网上找到任何信息。我正在尝试创建一个网格并需要将 ObservableCollection 的 ObservableCollection 绑定到它。想象一下这样的模型：

public class App
{
    private ObservableCollection<MyNewCollection> collections;
}

public class MyNewCollection : DependencyObject
{
    public ObservableCollection<MyCollectionItem> items;
    // ... public properties: string CollectionTitle 
}

public class MyCollectionItem : DependencyObject 
{
    // ... public properties: string ItemTitle
}

我希望网格的第一列列出集合对象中的项目，以便每一行都包含来自集合 ObservableCollections 中一个项目的 CollectionTitle。对于第二列，我希望每一行都包含与相应集合对象关联的一组 MyCollectionItems 项。

从上面的代码：

集合为“c”
项目为“我”

+-------------------------------------------------- --------------------------------------------+ + |第 0 列 |第 1 栏 | +-------------------------------------------------- --------------------------------------------------------| + 第 0 行 | c[0].CollectionTitle | c[0].i[0].ItemTitle ...i[1].ItemTitle ... i[2].ItemTitle | + 第 1 行 | c[1].CollectionTitle | c[1].i[0].ItemTitle ...i[1].ItemTitle ... i[2].ItemTitle | + | | | + ... | +-------------------------------------------------- --------------------------------------------+

如果我有一组静态的 MyNewCollection 对象，这会很容易，但由于它可以增长到无穷大，我需要为 MyNewCollection 对象创建一个新的 ObservableCollection，这就是我在理解如何做时遇到麻烦的地方这与 WPF。任何帮助将不胜感激。

谢谢。

【问题讨论】：

标签： c# wpf observablecollection

【解决方案1】：

这是使用 ItemsControl 的一种方法，其中每一行都包含另一个 ItemsControl。

Xaml：

<Page.Resources>
    <DataTemplate x:Key="ChildItemTemplate" 
                  DataType="{x:Type Samples:NestedCollectionItem}">
        <TextBlock Text="{Binding Title}" Margin="5"/>
    </DataTemplate>
    <ItemsPanelTemplate x:Key="ChildItemPanel">
        <StackPanel Orientation="Horizontal"/>
    </ItemsPanelTemplate>
    <DataTemplate x:Key="ItemTemplate" 
                  DataType="{x:Type Samples:NestedCollectionChildViewModel}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" SharedSizeGroup="c1"/>
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <TextBlock VerticalAlignment="Center"  Text="{Binding Title}"/>
            <ItemsControl 
                Grid.Column="1" 
                ItemsSource="{Binding Items}"
                ItemsPanel="{StaticResource ChildItemPanel}"
                ItemTemplate="{StaticResource ChildItemTemplate}"
                />
        </Grid>
    </DataTemplate>
</Page.Resources>

<Page.DataContext>
    <Samples:NestedCollectionRootViewModel/>
</Page.DataContext>

<Grid>
    <ItemsControl 
        Grid.IsSharedSizeScope="True"
        ItemsSource="{Binding Items}" 
        ItemTemplate="{StaticResource ItemTemplate}"/>
</Grid>

代码：

public class NestedCollectionRootViewModel
{
    public NestedCollectionRootViewModel()
    {
        Items =
            new ObservableCollection<NestedCollectionChildViewModel>
                {
                    new NestedCollectionChildViewModel
                        {
                            Title = "Item 1",
                            Items =
                                new ObservableCollection<NestedCollectionItem>
                                    {
                                        new NestedCollectionItem {Title = "One"},
                                        new NestedCollectionItem {Title = "Two"},
                                        new NestedCollectionItem {Title = "Three"},
                                        new NestedCollectionItem {Title = "Four"},
                                    }
                        },

                    new NestedCollectionChildViewModel
                        {
                            Title = "Item 2",
                            Items =
                                new ObservableCollection<NestedCollectionItem>
                                    {
                                        new NestedCollectionItem {Title = "Five"},
                                        new NestedCollectionItem {Title = "Six"},
                                    }
                        },

                };
    }

    public ObservableCollection<NestedCollectionChildViewModel> Items 
       { get; private set; }
}

public class NestedCollectionChildViewModel
{
    public string Title { get; set; }
    public ObservableCollection<NestedCollectionItem> Items { get; set; }
}

public class NestedCollectionItem
{
    public string Title { get; set; }
    // ... etc
}

【讨论】：

太棒了 - 每天都爱上 WPF。谢谢菲尔！

【解决方案2】：

我只简单地使用过 C#，但是，如果我没记错的话，当你不能直接绑定时，你应该编写一个自定义的 ValueConverter 类，它处理你的 MyCollectionItem 元素，然后在绑定中使用它。

【讨论】：