How can I see default DependencyProperty value in design time when I'm using binding

Question

I have some polygon on UserControl that I want to color:

<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
    <GradientStop Color="{Binding Color}" Offset="0"/>
    <GradientStop Color="{Binding SecondaryColor}" Offset="0.5"/>
    <GradientStop Color="{Binding Color}" Offset="1"/>
</LinearGradientBrush>

This is my DataContext:

<DataContext="{Binding RelativeSource={RelativeSource Self}}">

And this is my dependency property with default value defined in PropertyMetadata:

[Category("Silo - appearance")]
public Color Color
{
    get { return (Color)GetValue(ColorProperty); }
    set { SetValue(ColorProperty, value); }
}
public static readonly DependencyProperty ColorProperty =
    DependencyProperty.Register("Color", typeof(Color), typeof(Silo), 
        new PropertyMetadata((Color)Color.FromArgb(255,0x27, 0x77, 0x9E)));

My Polygon where I put this LinearGradientBrush is transparent in UserControl design time.

I have tried to rebuild solution, but there is no difference.

1. Why my default value is not applied in design time?

2. What can I do to see (in design time) default color defined in PropertyMetadata?

Answer 1

One way I know to solve that is not very nice, but seems to be working. You can move your dependency properties to parent class and inherit your user control from that class. For example:

public class Parent : UserControl
{
    [Category("Silo - appearance")]
    public Color Color
    {
        get { return (Color)GetValue(ColorProperty); }
        set { SetValue(ColorProperty, value); }
    }
    public static readonly DependencyProperty ColorProperty =
        DependencyProperty.Register("Color", typeof(Color), typeof(Parent),
            new PropertyMetadata((Color)Color.FromArgb(255, 0x1A, 0x17, 0xA)));

    public Color SecondaryColor
    {
        get { return (Color)GetValue(SecondaryColorProperty); }
        set { SetValue(SecondaryColorProperty, value); }
    }

    public static readonly DependencyProperty SecondaryColorProperty =
        DependencyProperty.Register("SecondaryColor", typeof(Color), typeof(Parent), new PropertyMetadata(Color.FromArgb(255, 0x47, 0x17, 0x9E)));
}

public partial class UserControl1 : Parent
{
    public UserControl1()
    {
        InitializeComponent();
    }       
}

And then in xaml:

<local:Parent x:Class="WpfApplication1.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:WpfApplication1"
             mc:Ignorable="d"
             d:DesignHeight="300"
             d:DesignWidth="300"
              DataContext="{Binding RelativeSource={RelativeSource Self}}">
    <Rectangle Height="300" Width="300">
        <Rectangle.Fill>
            <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
                <GradientStop Color="{Binding Color}" Offset="0"/>
                <GradientStop Color="{Binding SecondaryColor}" Offset="0.5"/>
                <GradientStop Color="{Binding Color}" Offset="1"/>
            </LinearGradientBrush>
        </Rectangle.Fill>
    </Rectangle>
</local:Parent>

I'm not completely certain why it works, but my guess is: wpf designer does not run code in your control at all. It is already known that it will not run constructor of your UserControl1, and it seems it will not execute other code there too (like static field initializers for your dependency property). However it will instantiate parent class as this example shows. Probably it dynamically creates new control with no additional code and inherits it from the class your control inherits. How exactly WPF designer works is not well documented (if at all), so we can only guess.

Alternative (and I think better) approach will be just use design-time data context:

public class UserControlDesignContext {
    public Color Color { get; set; } = Color.FromArgb(255, 0x11, 0x17, 0xA);
    public Color SecondaryColor { get; set; } = Color.FromArgb(255, 0x47, 0x17, 0x9E);
}

And then in xaml:

<UserControl x:Class="WpfApplication1.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:WpfApplication1"
             mc:Ignorable="d"
             d:DesignHeight="300"
             d:DesignWidth="300"
              d:DataContext="{d:DesignInstance local:UserControlDesignContext, IsDesignTimeCreatable=True}"
              DataContext="{Binding RelativeSource={RelativeSource Self}}">
    <Rectangle Height="300" Width="300">
        <Rectangle.Fill>
            <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
                <GradientStop Color="{Binding Color}" Offset="0"/>
                <GradientStop Color="{Binding SecondaryColor}" Offset="0.5"/>
                <GradientStop Color="{Binding Color}" Offset="1"/>
            </LinearGradientBrush>
        </Rectangle.Fill>
    </Rectangle>
</UserControl>