WPF Designer and Binding to Dependency Property problem

Question

Hello all,

I have a problem updating the WPF Designer when binding to custom dependency properties.

In the following example, I create a simple Ellipse that I would like to fill with my custom MyAwesomeFill property. The MyAwesomeFill has a default value of a Yellow SolidColor brush.

The problem is that in the control form of the designer I cannot see the default fill of the ellipse (Yellow), instead the ellipse is filled with SolidColor (#00000000). However, when I run the application everything works PERFECTLY.

Do you have any ideas why this may be happenning?

Thanks.

Here's the code that I use:

XAML:

<UserControl x:Class="TestApplication.MyEllipse"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Height="300" Width="300">
    <Grid>
        <Ellipse Stroke="Black" StrokeThickness="5" Fill="{Binding MyAwesomeFill}"></Ellipse>
    </Grid>
</UserControl>

C#:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace TestApplication
{
    public partial class MyEllipse : UserControl
    {
        #region Dependency property MyAwesomeFill
        //Define and register dependency property
        public static readonly DependencyProperty MyAwesomeFillProperty = DependencyProperty.Register(
            "MyAwesomeFill",
            typeof(Brush),
            typeof(MyEllipse),
            new PropertyMetadata(new SolidColorBrush(Colors.Yellow), new PropertyChangedCallback(OnMyAwesomeFillChanged))
        );

        //property wrapper
        public Brush MyAwesomeFill
        {
            get { return (Brush)GetValue(MyAwesomeFillProperty); }
            set { SetValue(MyAwesomeFillProperty, value); }
        }

        //callback
        private static void OnMyAwesomeFillChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
        {
            MyEllipse m = (MyEllipse)obj;
            m.OnMyAwesomeFillChanged(e);
        }
        #endregion

        //callback
        protected virtual void OnMyAwesomeFillChanged(DependencyPropertyChangedEventArgs e)
        {
        }

        public MyEllipse()
        {
            InitializeComponent();

            DataContext = this;
        }

    }
}

Answer 1

Code behind is not guaranteed to be run by the designer. If you add your MyEllipse control to a window it will run (ellipse in window has yellow background) but not when you look at the control directly. This means it will work for users of your control which is what is important.

To fix it to look good when opening up MyEllipse in the designer, add a fallback value.

<Ellipse 
    Stroke="Black" 
    StrokeThickness="5" 
    Fill="{Binding MyAwesomeFill, FallbackValue=Yellow}">
</Ellipse>