根据属性在xaml视图中显示分组的可观察集合

时间:2017-11-27 09:58:23

标签: c# wpf xaml

让我们想象一下:

namespace Project.Common
{
    public enum FileTypeEnum
    {
        Text = 1,
        Image = 2,
        Audio = 3,
        Video = 4
    }

    public class Artifact
    {
        public long? ArtifactId { get; set; }
        public FileTypeEnum FileType { get; set; }
        public string Path { get; set; }
        public string Text { get; set; }
    }
}

上面是所有文件类型的枚举。此外,还有Artifact模型。下面是一个名为Artifacts的可观察集合,例如:

public ObservableCollection<Grouping<FileTypeEnum, Artifact>> Artifacts {get; set;}

现在,当页面加载时,使用虚拟数据我将列表填充为。

var list = new List<Artifact>();
list.Add(new Artifact() { ArtifactId = 1, FileType = FileTypeEnum.Image, Path = String.Format(@"\img.png") });
list.Add(new Artifact() { ArtifactId = 2, FileType = FileTypeEnum.Audio,  Path = String.Format(@"\aud.mp3") });
list.Add(new Artifact() { ArtifactId = 3, FileType = FileTypeEnum.Text,  Path = "", Text = "Lorem Ipsum .." });
list.Add(new Artifact() { ArtifactId = 4, FileType = FileTypeEnum.Image,  Path = String.Format(@"img.png") });
list.Add(new Artifact() { ArtifactId = 5, FileType = FileTypeEnum.Video, Path = String.Format(@"vid.mp4") });
list.Add(new Artifact() { ArtifactId = 6, FileType = FileTypeEnum.Image,, Path = String.Format(@"img.png") });

目标是在视图中将可观察的集合显示为分组数据,图像块下的所有图像,音频块下的音频等等。

我为 -

尝试过的

我使用以下类根据相同的文件类型对列表进行分组:

public class Grouping<T1, T2>
{
    private FileTypeEnum key;
    private IGrouping<FileTypeEnum, Artifact> group;

    public Grouping(FileTypeEnum key, IGrouping<FileTypeEnum, Artifact> group)
    {
        this.key = key;
        this.group = group;
    }
}

以便可观察集合为

var grouped = from m in list
              group m by m.FileType into Group
              select new Grouping<FileTypeEnum, Artifact>(Group.Key, Group);

this.Artifacts = new ObservableCollection<Grouping<FileTypeEnum, Artifact>>(grouped);

这将返回基于作为文件类型的键组合在一起的所有工件。问题是xaml视图,我无法正确呈现(因为我不知道如何)。到目前为止xaml视图如下:

<ItemsControl ItemsSource="{Binding Artifacts}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel Orientation="Horizontal" IsItemsHost="True"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <Label Content="{Binding key}" />
                <ItemsControl ItemsSource="{Binding}" >
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Image Source="{Binding Path}"/>
                        </DataTemplate >
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </StackPanel>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl> 

我的理解是为每种文件类型设置不同的<DataTemplate>,以便我可以在&#39;图像&#39;下显示所有图像。类似地,标题和一起在Audio标题下的所有音频块。我的方法的任何替代方案都受到欢迎。

1 个答案:

答案 0 :(得分:0)

将您的分组类中的密钥和组设为公开。还将Itemssource绑定到组。