{"id":64,"date":"2010-12-06T21:17:00","date_gmt":"2010-12-06T21:17:00","guid":{"rendered":"https:\/\/wdev-blog.azurewebsites.net\/index.php\/2010\/12\/06\/introducing-custom-dependencyproperty-in-wpf\/"},"modified":"2010-12-06T21:17:00","modified_gmt":"2010-12-06T21:17:00","slug":"introducing-custom-dependencyproperty-in-wpf","status":"publish","type":"post","link":"http:\/\/panahy.nl\/index.php\/2010\/12\/06\/introducing-custom-dependencyproperty-in-wpf\/","title":{"rendered":"Introducing Custom DependencyProperty in WPF"},"content":{"rendered":"

In this sample code I want to introduce three DependencyProperty called Overlap Rotation and UpperOffset in a custom control OverlapStackPannel. The control is simply a StackPanel that arranges the containing items in a custom manner.<\/p>\n

In the ArrageOverride method I will use these three properties to locate each item as follows:<\/p>\n

<\/p>\n

<\/p>\n
   protected<\/span>  override<\/span>  System.Windows.Size<\/span>  ArrangeOverride(System.Windows.Size<\/span>  arrangeSize)<\/span><\/span><\/span><\/span><\/pre>\n
   {<\/span><\/pre>\n
     UIElementCollection<\/span>  children = this<\/span>.InternalChildren;<\/span><\/span><\/pre>\n

<\/pre>\n
    int<\/span>  childrenResolved = 0;<\/span><\/pre>\n
    foreach<\/span>  (UIElement<\/span>  child in<\/span>  children)<\/span><\/span><\/span><\/pre>\n
    {<\/span><\/pre>\n
 Rect<\/span>  targetRect = new<\/span>  Rect<\/span> ();<\/span><\/span><\/span><\/pre>\n
 targetRect.X = this<\/span> .Overlap * childrenResolved;<\/span><\/pre>\n
 targetRect.Y = this<\/span> .UpperOffset;<\/span><\/pre>\n
 targetRect.Width = child.DesiredSize.Width;<\/pre>\n
 targetRect.Height = child.DesiredSize.Height;<\/pre>\n
 child.Arrange(targetRect);<\/pre>\n
 child.RenderTransform = new<\/span>  RotateTransform<\/span> (this<\/span> .Rotation);<\/span><\/span><\/span><\/pre>\n
 childrenResolved++;<\/pre>\n
    }<\/span><\/pre>\n
    return<\/span>  arrangeSize;<\/span><\/pre>\n
   }<\/span><\/pre>\n

<\/pre>\n<\/div>\n

To Achieve this I need to set the properties as follows:<\/p>\n
<\/p>\n
\n
  #region<\/span>  Property: UpperOffset<\/span><\/pre>\n
  public<\/span>  static<\/span>  readonly<\/span>  DependencyProperty<\/span>  UpperOffsetProperty = DependencyProperty<\/span> .Register(\"UpperOffset\"<\/span> , typeof<\/span> (double<\/span> ), typeof<\/span> (OverlapStackPanel<\/span> ), new<\/span>  FrameworkPropertyMetadata<\/span> (double<\/span> .NaN, FrameworkPropertyMetadataOptions<\/span> .AffectsArrange));<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/pre>\n
      <\/pre>\n
  \/\/\/ <summary><\/span> <\/span><\/span><\/span><\/pre>\n
  \/\/\/ set or get the upper offset for each item in the pannel<\/span> <\/span><\/span><\/pre>\n
  \/\/\/ <\/summary><\/span> <\/span><\/span><\/span><\/pre>\n
  public<\/span>  double<\/span>  UpperOffset<\/span><\/span><\/pre>\n
  {<\/span><\/pre>\n
    get<\/span> <\/span><\/pre>\n
    {<\/span><\/pre>\n
      return<\/span>  (double<\/span> )this<\/span> .GetValue(OverlapStackPanel<\/span> .UpperOffsetProperty);<\/span><\/span><\/span><\/span><\/pre>\n
    }<\/span><\/pre>\n
    set<\/span> <\/span><\/pre>\n
    {<\/span><\/pre>\n
      this<\/span> .SetValue(OverlapStackPanel<\/span> .UpperOffsetProperty, value<\/span> );<\/span><\/span><\/span><\/pre>\n
    }<\/span><\/pre>\n
  }<\/span><\/pre>\n
  #endregion<\/span> <\/span><\/pre>\n

<\/span><\/span><\/pre>\n<\/div>\n
<\/p>\n
and similar for other two.
This makes my OverlapStackPanel having the properties in Blend like this:<\/p>\n
\"\"<\/a><\/p>\n
Benefits<\/h3>\n
According to this<\/a> nice article there are three main advantages of using DependencyProperties comparing to CLR properties:<\/p>\n