wpf - 为 WPF 设计数据模板

Question

使用 WPF、XAML、VS2008 和 Blend 2(或 3 Beta 首选)，您创建数据模板的过程是什么？您是否有测试数据模板外观的过程，而无需启动您的应用程序只是为了测试数据的外观？是否有我可以在 Blend 中使用的流程来使开发数据模板更加图形化？

Answer 1

您可以在设计时通过 Blend 指定数据，或者(使其在 VS 中也能正常工作)执行以下操作:

创建您设置为 DataContext 的对象的子类。

在这个子类的构造函数中，将属性设置为一些测试值。

将子类的实例声明为资源。

将 DataContext 设置为此资源。

请记住在运行时将 DataContext 清除或设置为合理的值，否则用户将看到您的设计时数据。

也适用于 Silverlight。

下面是一些示例代码:

// The object (in a list) that'll be bound as our ListBox ItemsSource
public class Person
{
    public string FirstName { get; set; }
    public string LastName { get; set; }
}

// Our design-time data. Note that we add list items in the constructor
public class PersonDesignTimeData : ObservableCollection<Person>
{
    public PersonDesignTimeData()
    {
        this.Add(new Person { FirstName = "Fred", LastName = "Smith" });
        this.Add(new Person { FirstName = "Jim", LastName = "Brown" });
        this.Add(new Person { FirstName = "Dave", LastName = "Jones" });
    }
}

Window1.xaml:

<Window x:Class="DesignTimeDataDemo.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:DesignTimeDataDemo"
    Title="Window1" Height="300" Width="300">
    <Window.Resources>
        <local:PersonDesignTimeData x:Key="PersonDesignTimeData"/>
    </Window.Resources>
    <Grid x:Name="root" DataContext="{StaticResource PersonDesignTimeData}">
        <ListBox
            ItemsSource="{Binding}"
            >
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Width="200">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="2*"/>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.Column="0" Text="{Binding FirstName}"/>
                        <TextBlock Grid.Column="1" Text="{Binding LastName}"/>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

    </Grid>
</Window>