如何在XAML中设置矩形笔划厚度的动画?

如何在XAML中设置矩形笔划厚度的动画?,xaml,windows-8,windows-runtime,storyboard,visualstates,Xaml,Windows 8,Windows Runtime,Storyboard,Visualstates,我一直试图改变我的按钮笔划厚度,但我似乎遗漏了一些东西。基本思想是,当我缩小矩形周围的透明笔划(边框)时,我希望按钮看起来放大 以下是我使用的变体: <DoubleAnimation To="10" Storyboard.TargetName="innerRectangle" Storyboard.TargetProperty="(Rectangle.StrokeProperty).StrokeThickness"> </DoubleAnimatio

我一直试图改变我的按钮笔划厚度,但我似乎遗漏了一些东西。基本思想是,当我缩小矩形周围的透明笔划(边框)时,我希望按钮看起来放大

以下是我使用的变体:

<DoubleAnimation To="10" 
      Storyboard.TargetName="innerRectangle" 
      Storyboard.TargetProperty="(Rectangle.StrokeProperty).StrokeThickness">
</DoubleAnimation>

我还使用了以下行:

<DoubleAnimation To="10" 
      Storyboard.TargetName="innerRectangle" 
      Storyboard.TargetProperty="StrokeThickness">
</DoubleAnimation>

以及:


以上这些都不起作用

守则全文如下:

<Style x:Key="SecondaryButton"  TargetType="Button">
    <!--<Setter Property="Background" Value="LightSkyBlue"></Setter>
    <Setter Property="Foreground" Value="Black"></Setter>-->
    <Setter Property="Padding" Value="5"></Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid Background="Transparent" x:Name="RootGrid">

                    <Border x:Name="Outline" BorderBrush="Transparent" BorderThickness="2">
                    <Rectangle x:Name="innerRectangle" HorizontalAlignment="Stretch" 
                                   VerticalAlignment="Stretch" Stroke="Red" 
                                   StrokeThickness="15" Fill="LightSkyBlue" 
                                   RadiusX="15" RadiusY="15"  />
                    </Border>
                    <ContentPresenter x:Name="Text" Content="{TemplateBinding Content}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="Black"/>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <!--<Storyboard>
                                    <ColorAnimation To="Black" Storyboard.TargetName="Text" Storyboard.TargetProperty="(Button.Foreground).(SolidColorBrush.Color)"></ColorAnimation>
                                    <ColorAnimation To="LightSkyBlue"  Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"></ColorAnimation>
                                </Storyboard>-->
                            </VisualState>
                            <VisualState x:Name="PointerOver">
                                <Storyboard>
                                    <!--<ColorAnimation To="LightBlue"  Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"></ColorAnimation>-->
                                    <DoubleAnimation To="10" 
                                                     Storyboard.TargetName="innerRectangle" 
                                                     Storyboard.TargetProperty="(Rectangle.StrokeThickness)"
                                                     >
                                    </DoubleAnimation>
                                    <!--<ColorAnimation To="LightSkyBlue"
                                                    Storyboard.TargetName="innerRectangle"
                                                    Storyboard.TargetProperty="(Rectangle.Stroke).(SolidColorBrush.Color)">
                                    </ColorAnimation>-->
                                    <!--<ColorAnimation To="Red"  
                                                    Storyboard.TargetName="Outline" 
                                                    Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)">
                                    </ColorAnimation>-->
                                </Storyboard>                                    
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <DoubleAnimation To="10" 
                                                     Storyboard.TargetName="innerRectangle" 
                                                     Storyboard.TargetProperty="StrokeThickness">
                                    </DoubleAnimation>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

请确保您可以

<Style x:Key="SecondaryButton"  TargetType="Button">
    <!--<Setter Property="Background" Value="LightSkyBlue"></Setter>
    <Setter Property="Foreground" Value="Black"></Setter>-->
    <Setter Property="Padding" Value="5"></Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid Background="Transparent" x:Name="RootGrid">

                    <Border x:Name="Outline" BorderBrush="Transparent" BorderThickness="2">
                    <Rectangle x:Name="innerRectangle" HorizontalAlignment="Stretch" 
                                   VerticalAlignment="Stretch" Stroke="Red" 
                                   StrokeThickness="15" Fill="LightSkyBlue" 
                                   RadiusX="15" RadiusY="15"  />
                    </Border>
                    <ContentPresenter x:Name="Text" Content="{TemplateBinding Content}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="Black"/>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <!--<Storyboard>
                                    <ColorAnimation To="Black" Storyboard.TargetName="Text" Storyboard.TargetProperty="(Button.Foreground).(SolidColorBrush.Color)"></ColorAnimation>
                                    <ColorAnimation To="LightSkyBlue"  Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"></ColorAnimation>
                                </Storyboard>-->
                            </VisualState>
                            <VisualState x:Name="PointerOver">
                                <Storyboard>
                                    <!--<ColorAnimation To="LightBlue"  Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"></ColorAnimation>-->
                                    <DoubleAnimation To="10" 
                                                     Storyboard.TargetName="innerRectangle" 
                                                     Storyboard.TargetProperty="(Rectangle.StrokeThickness)"
                                                     >
                                    </DoubleAnimation>
                                    <!--<ColorAnimation To="LightSkyBlue"
                                                    Storyboard.TargetName="innerRectangle"
                                                    Storyboard.TargetProperty="(Rectangle.Stroke).(SolidColorBrush.Color)">
                                    </ColorAnimation>-->
                                    <!--<ColorAnimation To="Red"  
                                                    Storyboard.TargetName="Outline" 
                                                    Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)">
                                    </ColorAnimation>-->
                                </Storyboard>                                    
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <DoubleAnimation To="10" 
                                                     Storyboard.TargetName="innerRectangle" 
                                                     Storyboard.TargetProperty="StrokeThickness">
                                    </DoubleAnimation>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>