Xaml 创建带有附加属性的ControlTemplate

我实际上是在尝试创建一个带有图像背景和边框的按钮，如果它处于悬停、单击或默认状态，则该按钮的颜色会发生变化。我将介绍几种类型的按钮，并希望定义一个ControlTemplate，以便重用和更改ImageSource。这是我到目前为止所做的，但由于某些原因，TemplateBinding似乎不起作用。按钮没有设置背景图像

模板：

    <ControlTemplate x:Name="SkillIconTemplate" TargetType="Button">
        <Border CornerRadius="10" BorderThickness="2" Margin="5">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualStateGroup.Transitions>
                        <VisualTransition To="MouseOver" GeneratedDuration="0:0:0.1"/>
                        <VisualTransition To="Pressed" GeneratedDuration="0:0:0.1"/>
                    </VisualStateGroup.Transitions>
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="BorderBrush" 
                                                    Storyboard.TargetProperty="Color" 
                                                    To="Yellow" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Pressed">
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="BorderBrush" 
                                                    Storyboard.TargetProperty="Color"
                                                    To="Black"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Border.BorderBrush>
                <SolidColorBrush x:Name="BorderBrush" Color="White"/>
            </Border.BorderBrush>
            <Border.Background>
                <ImageBrush ImageSource="{TemplateBinding local:SkillIcon.IconImageSource}"/>
            </Border.Background>
        </Border>
    </ControlTemplate>

---

我最终将按钮的背景绑定到边框的背景：

    <ControlTemplate x:Name="SkillIconTemplate" TargetType="Button">
        <Border CornerRadius="10" BorderThickness="2" Margin="5" Background="{TemplateBinding Background}">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualStateGroup.Transitions>
                        <VisualTransition To="MouseOver" GeneratedDuration="0:0:0.05"/>
                        <VisualTransition To="Pressed" GeneratedDuration="0:0:0.05"/>
                    </VisualStateGroup.Transitions>
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="BorderBrush" 
                                                    Storyboard.TargetProperty="Color" 
                                                    To="Yellow" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Pressed">
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="BorderBrush" 
                                                    Storyboard.TargetProperty="Color"
                                                    To="Black"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Border.BorderBrush>
                <SolidColorBrush x:Name="BorderBrush" Color="White"/>
            </Border.BorderBrush>
        </Border>
    </ControlTemplate>

public abstract class SkillIcon : DependencyObject
{
    public static readonly DependencyProperty IconImageSourceProperty = DependencyProperty.RegisterAttached(
        "IconImageSource", 
        typeof(ImageSource), 
        typeof(SkillIcon),
        new PropertyMetadata(GetIconImage(0))
        );

    public static ImageSource GetIconImageSource(DependencyObject obj)
    {
        return (ImageSource)obj.GetValue(IconImageSourceProperty);
    }

    public static void SetIconImageSource(DependencyObject obj, ImageSource value)
    {
        obj.SetValue(IconImageSourceProperty, value);
    }

    /// <summary>
    /// Gets the image source for the button
    /// </summary>
    public static ImageSource GetIconImage(int index)
    {
        Uri source = new Uri(string.Format("ms-appx:/data/images/icons/skill_icon_{0}.png", index), UriKind.RelativeOrAbsolute);
        return new BitmapImage() { UriSource = source };
    }
}

        SkillIcon.SetIconImageSource(skillIcon0, SkillIcon.GetIconImage(0));

    <ControlTemplate x:Name="SkillIconTemplate" TargetType="Button">
        <Border CornerRadius="10" BorderThickness="2" Margin="5" Background="{TemplateBinding Background}">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualStateGroup.Transitions>
                        <VisualTransition To="MouseOver" GeneratedDuration="0:0:0.05"/>
                        <VisualTransition To="Pressed" GeneratedDuration="0:0:0.05"/>
                    </VisualStateGroup.Transitions>
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="BorderBrush" 
                                                    Storyboard.TargetProperty="Color" 
                                                    To="Yellow" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Pressed">
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="BorderBrush" 
                                                    Storyboard.TargetProperty="Color"
                                                    To="Black"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Border.BorderBrush>
                <SolidColorBrush x:Name="BorderBrush" Color="White"/>
            </Border.BorderBrush>
        </Border>
    </ControlTemplate>