WPF 数据网格样式答案

【问题标题】：WPF DataGrid StylingWPF 数据网格样式
【发布时间】：2010-10-07 23:39:25
【问题描述】：

是否有人知道/有一个示例，说明如何将 WPF DataGrid 布局更改为卡片视图或其他任何内容，而不仅仅是行堆栈？

【问题讨论】：

你能给我们举一个卡片视图的例子吗？
是的，如果您仍然感兴趣，我会发布答案。

标签： wpf datagrid wpf-controls styles wpftoolkit

【解决方案1】：

结果如下所示。 alt text http://iwebthereforeiam.com/files/ScreenShot.gif

这里的代码应该可以证明这个想法。

XAML：

<Window x:Class="StackOverflow_545979.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:StackOverflow_545979"
    xmlns:debug="clr-namespace:System.Diagnostics;assembly=System"
    Title="Window1" Height="300" Width="300">

    <Window.Resources>
        <local:GreekGods  x:Key="GreekGods"/>
        <DataTemplate x:Key="itemTemplate">
            <Border BorderBrush="RoyalBlue" BorderThickness="2" Margin="2" Padding="5">
                <WrapPanel Orientation="Vertical">
                    <TextBlock Width="200" Text="{Binding Path=Name}"/>
                    <TextBlock Width="200" Text="{Binding Path=Description}"/>
                    <TextBlock Width="200" Text="{Binding Path=RomanName}"/>
                </WrapPanel>
            </Border>
        </DataTemplate>
    </Window.Resources>

    <ListBox ItemTemplate="{StaticResource itemTemplate}" 
             ItemsSource="{StaticResource GreekGods}" />
</Window>

C#代码：

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
namespace StackOverflow_545979
{
    public class GreekGod
    {
        public string Name { get; set; }
        public string Description { get; set; }
        public string RomanName { get; set; }

        public GreekGod() { }
        public GreekGod(string name, string description, string romanName)
        {
            this.Name = name;
            this.Description = description;
            this.RomanName = romanName;
        }
    }

    public class GreekGods : ObservableCollection<GreekGod>
    {
        public GreekGods()
        {
            this.Add(new GreekGod("Aphrodite", "Goddess of love, beauty and fertility", "Venus"));
            this.Add(new GreekGod("Apollo", "God of prophesy, music and healing", "Apollo"));
            this.Add(new GreekGod("Ares", "God of war", "Mars"));
            this.Add(new GreekGod("Artemis", "Virgin goddess of the hunt", "Diana"));
            this.Add(new GreekGod("Athena", "Goddess of crafts and the domestic arts", "Athena"));
            this.Add(new GreekGod("Demeter", "Goddess of agriculture", "Ceres"));
            this.Add(new GreekGod("Dionysus", "God of wine", "Bacchus"));
            this.Add(new GreekGod("Hephaestus", "God of fire and crafts", "Vulcan"));
            this.Add(new GreekGod("Hera", "Goddess of marriage", "Juno"));
            this.Add(new GreekGod("Hermes", "Messenger of the Gods", "Mercury"));
            this.Add(new GreekGod("Poseidon", "God of the sea, earthquakes and horses", "Neptune"));
            this.Add(new GreekGod("Zeus", "Supreme God of the Olympians", "Jupiter"));
        }
    }
}

GreekGod 和 GreekGods 类从 Bea Stollnitz's examples 提升。

【讨论】：

您已经更改了 ListBox 的模板，但问题是关于 DataGrid。
这部分是建议您使用 ListView 而不是 DataGrid。另外两个响应者明确建议不要使用 DataGrid 而是使用 ListView。有时你会问，“我怎样才能用 X 来做 Y？”人们告诉你，“不要用 X 做 Y。用 Z。”通常，这是正确的方法。因此，在 30 个月后，这是一个悬而未决的问题，您怎么看？
我认为如果问题是“如何设置 X 样式？”那么应该回答“X 可以这样那样的方式设置样式（或者不能设置样式）”。如果问题被表述为“我该怎么做 X？”那么可以回答“X可以通过使用Y或Z来完成”。

【解决方案2】：

我不知道如何使用 WPF Toolkit 的 DataGrid 来做到这一点，我怀疑它是否是您真正需要的。您可以使用 ListView 或 ListBox 来完成。将 ListView.View 设置为 IsItemsSource="True" 的 WrapPanel。然后使用 DataTemplate 制作卡片。有一个很好的例子可以让你大部分时间到达那里here。

【讨论】：

【解决方案3】：

尝试结合使用列表视图或列表框（取决于您想要的功能 - 都派生自 ItemsSource）和数据模板，而不是数据网格。这两个都是标准的 WPF，不是工具包的一部分。

http://blah.winsmarts.com/2007-3-WPF__The_DataTemplate,_choosing_how_your_data_will_look_like.aspx

【讨论】：