来自 json 的 XAML GridView 设计时数据答案

【问题标题】：XAML GridView design time data from json来自 json 的 XAML GridView 设计时数据
【发布时间】：2016-05-21 08:52:27
【问题描述】：

将设计时数据绑定到网格视图有多容易？

我将 json 绑定到 Grid.TextBlock 但 Grid.GridView.DataTemplate 不显示数据

Xaml

<Page
mc:Ignorable="d"
d:DataContext="{d:DesignData Source=/SampleData/sampledata.json}"
>

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="100"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>
    <StackPanel 
        Grid.Row="0" Grid.Column="0"
        <TextBlock Text="{Binding Name}"/>
    </StackPanel>
    <GridView 
        Grid.Row="1" Grid.Column="0"
        ItemsSource="{Binding ListItems}"
        >
        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapGrid Orientation="Vertical"></WrapGrid>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>
        <GridView.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <TextBlock Width="50" Height="50" Text="{Binding Name}"></TextBlock>
                </StackPanel>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>
</Grid>

Json

{
    "Name": "Root Name",
    "ListItems": [
        { "Name": "Title 1" },
        { "Name": "Title 2" },
        { "Name": "Title 3" }
    ]
}

结果

【问题讨论】：

标签： c# json wpf xaml gridview

【解决方案1】：

这是一个建议而不是一个答案。 JSON 设计数据似乎仅受 Windows 8.1 项目支持。我建议另一种解决方案，使用提供所需属性的模拟类。在您的情况下，您可以使用 ListItems 属性创建一个 SampleData 类：

public class ListItem
{
    public string Name { get; set; }
}

public class SampleData
{
    //Parameterless constructor needed!
    public SampleData()
    {
        ListItems = new ObservableCollection<ListItem>();
        ListItems.Add(new ListItem { Name = "foo" });
        ListItems.Add(new ListItem { Name = "bar" });
    }

    public ObservableCollection<ListItem> ListItems { get; set; }
}

SampleData 类需要有一个无参数的构造函数！

在 XAML 文件中只需添加设计时数据上下文（local 标记引用 SampleData 类程序集；

...
xmlns:local="clr-namespace:WpfDesignDataTest"
...

<ListView Grid.Row="1" Grid.Column="0" ItemsSource="{Binding ListItems}" d:DataContext="{d:DesignInstance Type=local:SampleData, IsDesignTimeCreatable=True}">

【讨论】：