XAML 旋转和增大标签动画

本文关键字：标签 动画 旋转 XAML | 更新日期: 2023-09-27 18:36:51

我想在 XAML 中同时制作一个增长和旋转的标签。为什么我的代码不起作用？（文本增长，但不旋转）

 <Window 
  xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
  Title = "Animation" 
  Height = "600" Width = "1000" WindowStartupLocation="CenterScreen">
  <Window.Resources>
    <Storyboard x:Key="Storyboard">
            <DoubleAnimation 
            Storyboard.TargetProperty="FontSize"
            From = "12" To = "200" Duration = "0:0:4"
            RepeatBehavior = "Forever" AutoReverse="True"/>
            <DoubleAnimation
            Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)"
            From="0" To="360" Duration="0:0:4"
            RepeatBehavior="Forever"/>
        </Storyboard>
  </Window.Resources>
    <Label x:Name="myLabel" Content = "Some text">
      <Label.Triggers>
        <EventTrigger RoutedEvent="Label.Loaded">
          <EventTrigger.Actions>
            <BeginStoryboard Storyboard="{StaticResource Storyboard}"/>
          </EventTrigger.Actions>
        </EventTrigger>
      </Label.Triggers>
    </Label>
</Window>

XAML 旋转和增大标签动画

您需要

为您的Label声明一个 RenderTranform（这里它将是一个 RotateTransform），并且您的DoubleAnimation定义中缺少Storyboard.TargetName="myLabel"。如果您想了解有关转换的更多信息，您将在此处找到所需的内容：

转换

定义如何映射或转换从一个点 坐标空间到另一个坐标空间。此映射是 由转换矩阵描述，该矩阵是三个的集合 包含三列双精度值的行。

以下代码修复了这些问题，应该可以工作（经过测试）：

 <Window 
  xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
  Title = "Animation" 
  Height = "600" Width = "1000" WindowStartupLocation="CenterScreen">
  <Window.Resources>
    <Storyboard x:Key="Storyboard">
            <DoubleAnimation 
            Storyboard.TargetProperty="FontSize" Storyboard.TargetName="myLabel"
            From = "12" To = "200" Duration = "0:0:4"
            RepeatBehavior = "Forever" AutoReverse="True"/>
                     <DoubleAnimation
            Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="myLabel"
            From="0" To="360" Duration="0:0:4"
            RepeatBehavior="Forever"/>
        </Storyboard>
  </Window.Resources>
  <StackPanel>
    <Label x:Name="myLabel" Content = "Some text" RenderTransformOrigin="0.5,0.5">
        <Label.RenderTransform>
             <RotateTransform/>
        </Label.RenderTransform>
      <Label.Triggers>
        <EventTrigger RoutedEvent="Label.Loaded">
          <EventTrigger.Actions>
            <BeginStoryboard Storyboard="{StaticResource Storyboard}"/>
          </EventTrigger.Actions>
        </EventTrigger>
      </Label.Triggers>
    </Label>
    </StackPanel>
</Window>

如果可以的话，我建议您使用 Blend 来创建动画，它确实（真的）简化了过程并让您节省了大量时间！这是一个起点;)

相关文章：