WPF自定义RoundButton控件：Color属性无法应用于动画问题求助

问题核心在于动画的To属性无法直接使用TemplateBinding，这是WPF动画系统对绑定解析的限制导致的。TemplateBinding作为轻量级绑定语法糖，在动画场景下无法正确解析到模板父级的自定义依赖属性，换成显式的RelativeSource绑定即可解决。

修改方案 #

将XAML中MouseOver和Pressed状态里的ColorAnimation的To属性，从TemplateBinding替换为带TemplatedParent的Binding：

<VisualState x:Name="MouseOver">
    <Storyboard>
        <ColorAnimation Storyboard.TargetName="Border" 
                        Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" 
                        To="{Binding HoverColor, RelativeSource={RelativeSource TemplatedParent}}" 
                        Duration="0:0:0.15" />
    </Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
    <Storyboard>
        <ColorAnimation Storyboard.TargetName="Border" 
                        Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" 
                        To="{Binding MouseDownColor, RelativeSource={RelativeSource TemplatedParent}}" 
                        Duration="0:0:0.15" />
    </Storyboard>
</VisualState>

原因说明 #

TemplateBinding本质是{Binding RelativeSource={RelativeSource TemplatedParent}, Mode=OneWay}的简化写法，但WPF动画系统在处理动画目标属性时，无法识别这种简化绑定的上下文，必须显式指定RelativeSource={RelativeSource TemplatedParent}，才能正确找到RoundButton实例上的HoverColor和MouseDownColor依赖属性。

修改后，既可以保留动画的正常运行，又能在外部通过设置HoverColor和MouseDownColor属性来定制按钮的状态颜色，完全满足复用控件的需求。

内容的提问来源于stack exchange，提问作者GHOST