How to have DesignTime data in WinRT XAML?

Question

How can I get DesignTime data in WinRT XAML so the designer shows sample data?

Answer 1

Here is the d:DesignInstance sample:

I will also use Jerry's Fruit class, but I won't use MVVM here as you don't need that to make it works.

Basically, we need to create the data model class (e.g., ViewModel or Model) that we want to have design data (e.g., in this case, I create a child class, but you don't need to).

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

public class SampleFruit : Fruit
{
    public SampleFruit()
    {
        Name = "Orange (Sample)";
    }
}

Then in our XAML, we can use d:DataContext to bind the child class.

Please note this line:

d:DataContext="{Binding Source={d:DesignInstance Type=local:SampleFruit, IsDesignTimeCreatable=True}}"

Now you should see your design time data on both Visual Studio Designer and Blend.

P.S. In Blend 2013, there is a data tab that let you create sample data as well.