How to see design-time data-binding in XAML editor (it works in runtime)?

Question

I data-binded version number to appear as follows:

<Window <!-- ... --> DataContext="{Binding RelativeSource={RelativeSource Self}}">
    <Grid>
        <TextBlock>
            Version is: 
            <Run Text="{Binding Version, Mode=OneWay}"></Run>
            and advancing...
        </TextBlock>
    </Grid>
</Window>

and it's working during run-time.

How can I see it during design-time in the XAML editor in Visual Studio 2012 ? I only see:

Version is: and advancing...

instead of:

Version is: 5.2.2 and advancing...

EDIT - My solution:

Jure's answer below works, but I ended up using a dummy view-model static code technique, which works better for me since the data is a mock of the real view-model type:

d:DataContext="{Binding Source={StaticResource DesignViewModel}}" ...

score 49 · Answer 1 · edited May 23 '17 at 12:17

49

Make sure that you have these definitions at the root tag of your xaml file (in your case the Window tag):

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"

Then, anywhere in the xaml (including the root tag) you can add this:

d:DataContext="{d:DesignInstance myNamespace:MyViewModel, IsDesignTimeCreatable=True}"

Now you just need to make sure that you initialize the values in a constructor or have default values for properties.

If you need to run a special logic for design mode, look at this answer.

edited May 23 '17 at 12:17

Community

1
1

answered May 06 '13 at 15:49

XAMeLi

6,189
2
22
29

But what if data context can't be created at design-time? (I am setting the design-time data to have intellisense, not to provide specific values to the view. In addition, the data context is a view model with complex constructor.) – Mike Rosoft Oct 24 '19 at 08:47
Folow-up: The problem I have been getting is that controls were being hidden in design-time. I have been setting the visibility property using converter, so I just added the following code to the converter: `if (DesignerProperties.GetIsInDesignMode(new DependencyObject())) return Visibility.Visible;` – Mike Rosoft Oct 24 '19 at 09:01

score 21 · Accepted Answer · edited Jun 05 '19 at 01:45

21

Short answer, you can't do it that way. VS designer is not executing runtime code and your binding will not be resolved in design time. But there is support for design time data through d:DesignData extension.

You can set design data context this way:

<Window xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    mc:Ignorable="d" 
    d:DataContext="{d:DesignData Source=/SampleData/SomeSampleData.xaml}"
    DataContext="{Binding RelativeSource={RelativeSource Self}}">
<Grid>
    <TextBlock>
        Version is: 
        <Run Text="{Binding Version, Mode=OneWay}"></Run>
        and advancing...
    </TextBlock>
</Grid>

d:DataContext={d:DesignData.... sets the desing time DataContext that will be used to resolve bindings in VS designer surface. You can set it to a xaml file that contains your sample data. Sample xaml file should be built with "DesignData" build action.

See more here: http://blogs.msdn.com/b/wpfsldesigner/archive/2010/06/30/sample-data-in-the-wpf-and-silverlight-designer.aspx

edited Jun 05 '19 at 01:45

Jujucat

170
1
15

answered May 06 '13 at 15:32

Jurica Smircic

6,117
2
22
27

Is there a way to see it using `Blend` ? – Tar May 06 '13 at 15:37
I don't think so. Designer will only show data set with d:DataContext property. – Jurica Smircic May 06 '13 at 15:55
d:DesignData doesn't work for me (using VS2013). I've been having some success using x:Static however. – Anonymous Coward Oct 20 '14 at 12:17
1

The link no longer works, it looks like it's here: https://danresa.wordpress.com/2010/07/04/sample-data-in-the-wpf-and-silverlight-designer/ – marbel82 Oct 01 '20 at 13:39

How to see design-time data-binding in XAML editor (it works in runtime)?

EDIT - My solution:

2 Answers2

Linked