Question

按下时我需要按一下按钮旋转，但我无法确定我的代码有什么问题。我今天刚开始使用XAML，所以它可能非常明显。当我运行我的代码时，我在运行时收到此错误：

类型＆＃39; System.Windows.Markup.XamlParseException＆＃39;的第一次机会异常。发生在PresentationFramework.dll
中
附加信息：Het initialiseren van System.Windows.Controls.Button heeft een uitzondering veroorzaakt。 regelnummer 63 en＆gt; regelpositie 15。

这是我到目前为止的代码：

<Button x:Name="ArrowButton" HorizontalAlignment="Left" Margin="148,198,0,0" VerticalAlignment="Top" Width="360" Height="360">
    <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click" SourceName="UpArrow">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation
Storyboard.TargetName="UpArrow"  
Storyboard.TargetProperty="(RenderTransform).(RotateTransform.Angle)"
From="0" To="360" Duration="0:0:2" 
RepeatBehavior="Forever" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Button.Triggers>
    <Button.Background>
        <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
            <GradientStop Color="#FFF3F3F3" Offset="0"/>
            <GradientStop Color="#FFEBEBEB"/>
            <GradientStop Color="#00CDCDCD"/>
        </LinearGradientBrush>
    </Button.Background>
    <Image Source="upArrow.png" Stretch="Fill" HorizontalAlignment="Center" VerticalAlignment="Center" Height="360" Width="360" RenderTransformOrigin="0.5,0.5" MouseDown="Image_MouseDown">
        <Image.RenderTransform>
            <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform Angle="90"/>
                <TranslateTransform/>
            </TransformGroup>
        </Image.RenderTransform>
    </Image>
</Button>

Answer 1

一个问题是您尝试轮播目标UpArrow并且没有具有此类名称的元素，因此请将您的Image命名为

<Image x:Name="UpArrow" ... />

第二个问题是您使用TransformGroup，因此您需要指定要设置动画的Transform

<DoubleAnimation 
    Storyboard.TargetName="UpArrow"  
    Storyboard.TargetProperty="RenderTransform.Children[2].(RotateTransform.Angle)" 
    From="0" 
    To="360" 
    Duration="0:0:2" 
    RepeatBehavior="Forever" />

所以你的XAML应该是这样的：

<Button x:Name="ArrowButton" HorizontalAlignment="Left" Margin="148,198,0,0" VerticalAlignment="Top" Width="360" Height="360">
   <Button.Triggers>
      <EventTrigger RoutedEvent="Button.Click">
         <BeginStoryboard>
            <Storyboard>
               <DoubleAnimation 
                  Storyboard.TargetName="UpArrow"  
                  Storyboard.TargetProperty="RenderTransform.Children[2].(RotateTransform.Angle)" 
                  From="0" 
                  To="360" 
                  Duration="0:0:2" 
                  RepeatBehavior="Forever" />
            </Storyboard>
         </BeginStoryboard>
      </EventTrigger>
   </Button.Triggers>
   <Button.Background>
      <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
         <GradientStop Color="#FFF3F3F3" Offset="0"/>
         <GradientStop Color="#FFEBEBEB"/>
         <GradientStop Color="#00CDCDCD"/>
      </LinearGradientBrush>
   </Button.Background>
   <Image 
      x:Name="UpArrow" 
      Source="upArrow.png" 
      Stretch="Fill" 
      HorizontalAlignment="Center" 
      VerticalAlignment="Center" 
      Height="360" 
      Width="360" 
      RenderTransformOrigin="0.5,0.5">
      <Image.RenderTransform>
         <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform Angle="90"/>
            <TranslateTransform/>
         </TransformGroup>
      </Image.RenderTransform>
   </Image>
</Button>

Answer 2

制作动画时我的建议，不要试图在代码中弄清楚怎么做！你已经融为一体。（当您制作图形时，不要通过绘图来绘制它们，而是通过绘制来绘制，与动画相同）只有在真正需要时，编辑代码才能添加完成触摸。

刚刚使用混合物来完成工作：

<Window.Resources>
    <Storyboard x:Key="OnClick1">
        <DoubleAnimationUsingKeyFrames RepeatBehavior="Forever" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" Storyboard.TargetName="UpArrow">
            <EasingDoubleKeyFrame KeyTime="0:0:1" Value="-360"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>
<Window.Triggers>
    <EventTrigger RoutedEvent="ButtonBase.Click" SourceName="ArrowButton">
        <BeginStoryboard Storyboard="{StaticResource OnClick1}"/>
    </EventTrigger>
</Window.Triggers>
<Grid x:Name="MainGrid" Grid.Row="0">
    <Button x:Name="ArrowButton" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100" Height="100" RenderTransformOrigin="0.5,0.5">
        <Image x:Name="UpArrow" Width="30" Height="30" RenderTransformOrigin="0.5, 0.5" >
            <Image.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Image.RenderTransform>
        </Image>
    </Button>
</Grid>

使用WPF窗体中的XAML旋转按钮

2 个答案: