wpf - Binding brush color to properties in ControlTemplate -

i trying make customcontrol derives button, shows colored rectangle. want have 2 properties on control can set, specify normal color (coldcolor), , color used when mouse on control (hotcolor).

i can't figure out how binding set between brush color , control properties. code:

generic.xaml:

<style targettype="{x:type local:testcustomcontrol}">     <setter property="template">         <setter.value>             <controltemplate targettype="{x:type local:testcustomcontrol}">                 <border borderbrush="{templatebinding borderbrush}"                         borderthickness="{templatebinding borderthickness}"                         name="myborder">                     <border.background>                         <!-- works: -->                         <!--<solidcolorbrush color="green" />-->                          <!-- doesn't work: -->                         <solidcolorbrush color="{templatebinding coldcolor}" />                     </border.background>                     <visualstatemanager.visualstategroups>                         <visualstategroup x:name="commonstates">                             <visualstate x:name="normal"/>                             <visualstate x:name="mouseover">                                 <storyboard>                                     <!-- works: -->                                     <!--<coloranimation storyboard.targetproperty="background.color" storyboard.targetname="myborder" to="red"  duration="0:0:0.2"/>-->                                      <!-- doesn't work: -->                                     <coloranimation storyboard.targetproperty="background.color" storyboard.targetname="myborder" to="{templatebinding hotcolor}"  duration="0:0:0.2"/>                                 </storyboard>                             </visualstate>                         </visualstategroup>                     </visualstatemanager.visualstategroups>                 </border>             </controltemplate>         </setter.value>     </setter> </style> 

testcustomcontrol.cs:

public class testcustomcontrol : button {     static testcustomcontrol()     {         defaultstylekeyproperty.overridemetadata(typeof(testcustomcontrol), new frameworkpropertymetadata(typeof(testcustomcontrol)));     }      public color hotcolor     {         { return (color)getvalue(hotcolorproperty); }         set { setvalue(hotcolorproperty, value); }     }      // using dependencyproperty backing store hotcolor.  enables animation, styling, binding, etc...     public static readonly dependencyproperty hotcolorproperty =         dependencyproperty.register("hotcolor", typeof(color), typeof(testcustomcontrol), new uipropertymetadata(new color()));      public color coldcolor     {         { return (color)getvalue(coldcolorproperty); }         set { setvalue(coldcolorproperty, value); }     }      // using dependencyproperty backing store coldcolor.  enables animation, styling, binding, etc...     public static readonly dependencyproperty coldcolorproperty =         dependencyproperty.register("coldcolor", typeof(color), typeof(testcustomcontrol), new uipropertymetadata(new color())); } 

usage in mainwindow.xaml:

<my:testcustomcontrol coldcolor="#ff0000af" hotcolor="#ffff00af"/> 

edit: "doesn't work" means testcustomcontrol entirely transparent.

there no obvious problem (afaik), change piece of code:

uipropertymetadata(new color()) 

to

uipropertymetadata(colors.white) 

and see if 'new color()' that's problem

edit -

if above didnt work, try changing this

<solidcolorbrush color="{templatebinding coldcolor}" /> 

to this

<solidcolorbrush color="{binding      relativesource={relativesource templatedparent},      path=coldcolor}" />