找不到在控件模板中对旋转变换进行动画处理的方法



我正在尝试为XAML中的按钮编写ControlTemplate。在Triggers集合中,我想使用RotateTransform旋转按钮的一个元素,该元素稍后将设置动画(为了简单起见,关闭了动画)。为此,我需要参考附加到按钮元素的旋转变换的Angle属性。这就是问题所在:我似乎找不到引用它的方法

<ControlTemplate x:Key="myButtonTemplate"
                 TargetType="Button">
    <Grid>
        <Ellipse x:Name="OuterCircle"
                 RenderTransformOrigin="0.5, 0.5">
            <Ellipse.Fill>
                <RadialGradientBrush Center="0.7,0.7">
                    <GradientStop Offset="0.9" Color="DarkBlue"/>
                    <GradientStop Offset="0.2" Color="White"/>
                </RadialGradientBrush>
            </Ellipse.Fill>
            <Ellipse.RenderTransform>
                <RotateTransform x:Name="myTransform" Angle="0"/>
            </Ellipse.RenderTransform>
        </Ellipse>
        <Ellipse x:Name="InnerCircle"
                 RenderTransformOrigin="0.5, 0.5"
                 Stroke="DarkBlue"
                 >
            <Ellipse.Fill>
                <RadialGradientBrush Center="0.35,0.35"
                                     RadiusX="0.7"
                                     RadiusY="0.7">
                    <GradientStop Offset="0.05" Color="#70B0FF"/>
                    <GradientStop Offset="0.9" Color="DarkBlue"/>
                </RadialGradientBrush>
            </Ellipse.Fill>
            <Ellipse.RenderTransform>
                <ScaleTransform ScaleX="0.8" ScaleY="0.8"/>
            </Ellipse.RenderTransform>
        </Ellipse>
        <Viewbox Margin="10">
            <ContentPresenter Margin="{TemplateBinding Padding}"/>
        </Viewbox>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter TargetName="myTransform" Property="Angle" Value="90"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

我试图通过x:name="myTransform"为RotateTransform命名,并将其作为Setter中的TargetName引用。这没用。一个尝试过的其他事情是像TargetName="OuterCircle.RenderTransofrm.RotateTransform"这样的"打点"。也没有快乐。

这似乎应该很容易,而且很可能是。有人能给我指明正确的方向吗?

谢谢,克里斯。

实际上,当您设置Storyboard.TargetName:时,您可以访问myTransform

<ControlTemplate.Triggers>
    <EventTrigger RoutedEvent="MouseEnter">
        <BeginStoryboard>
            <Storyboard>
                <DoubleAnimation Storyboard.TargetName="myTransform"
                                 Storyboard.TargetProperty="Angle"
                                 To="90" Duration="0:0:0.1"/>
            </Storyboard>
        </BeginStoryboard>
    </EventTrigger>
    <EventTrigger RoutedEvent="MouseLeave">
        <BeginStoryboard>
            <Storyboard>
                <DoubleAnimation Storyboard.TargetName="myTransform"
                                 Storyboard.TargetProperty="Angle"
                                 To="0" Duration="0:0:0.1"/>
            </Storyboard>
        </BeginStoryboard>
    </EventTrigger>
</ControlTemplate.Triggers>

最新更新