一步一步学习使用FireMonkey动画（2） 使用TAnimator类创建动画

在开始研究FireMonkey提供的动画组件前，回顾一下多数时候，只是想给控件加一些突出的提醒或点缀，所以无须真的添加一个动画组件。FMX（FireMonkey的简称）提供了一系列便利的操作。

本节将介绍：

1. 使用TFmxObject的动画函数。
2. 使用TAnimator对象快速创建动画。
3. TAnimator与其他的TAnimation动画组件的区别。

1. 使用FmxObject创建动画。

TFmxObject是位于TComponent和TControl类之间的一个提供组件呈现的中间类，这是将控件的视觉部分与行为部分进行分离的一个中间类。

TFmxObject 是 FireMonkey (FMX) 框架中几乎所有可视和非可视组件的基类。它不负责具体的渲染（那是 TControl 及其子类的工作），而是提供了构建整个 FMX 应用程序对象模型所需的核心基础功能。

本图来自《Delphi GUI Programming with FireMonkey》

1. 打开Delphi 12.3，在窗体上放一个TRectangle控件和2个Button,表单布局如下图：

2. 分别为按钮1和按钮2添加如下的事件处理代码，来快速实现动画效果。

// 功能：改变一个矩形的透明度，实现淡入淡出效果。
procedure TFormMain.Button1Click(Sender: TObject);
begin
  // 直接调用 Rectangle1 对象的 AnimateFloat 方法（内部实际调用TAnimator.AnimateFloat 类似）
  // 参数1 ('Opacity'): 要动画化的属性名称，这里是透明度属性（0为完全透明，1为完全不透明）
  // 参数2 (0.5): 动画的最终目标值，将透明度变化至 0.5（半透明）
  // 参数3 (2): 动画的持续时间，单位为秒，即动画在 2 秒内缓慢完成
  // 参数4 (TAnimationType.InOut): 动画曲线。InOut 表示动画开始和结束时都较缓慢，中间较快
  // 参数5 (TInterpolationType.Linear): 插值类型。线性插值，变化均匀
  Rectangle1.AnimateFloat('Opacity', 0.5, 2, TAnimationType.InOut,
    TInterpolationType.Linear);
end;

// 功能：改变一个矩形的填充颜色。
procedure TFormMain.Button2Click(Sender: TObject);
begin
  // 调用 Rectangle1 对象的 AnimateColor 方法，专门用于对颜色属性进行动画处理
  // 参数1 ('Fill.Color'): 要动画化的属性名称，这里是填充色的颜色属性
  // 参数2 ($FF0003F3): 动画的最终目标颜色值。这是一个十六进制的 TAlphaColor 值。
  //                    $FF 表示完全不透明（Alpha通道）
  //                    $0003F3 表示 RGB 颜色分量，此代码为一种蓝色
  // 参数3 (2): 动画的持续时间，2秒
  // 参数4 (TAnimationType.InOut): InOut 动画曲线
  // 参数5 (TInterpolationType.Linear): 线性插值，颜色会均匀过渡
  Rectangle1.AnimateColor('Fill.Color', $FF0003F3, 2, TAnimationType.InOut,
    TInterpolationType.Linear);
end;

运行效果如下所示：

AnimateFloat和AnimateColor分别对Trectangle的属性Opacity和Fill.Color设置了新的会睛，Duration指示动画的持续时间为2秒，最后指定了动画曲线和插值算法，在稍后的内容中会介绍。

如果查看这2个方法的定义，可以看到最终还是调用了TAnimator的相应的类方法：

在方法定义部分，可以看到Delphi建议使用TAnimator来替代使用这里的方法，接下来将使用TAnimator来创建折叠动画。

2. 使用TAnimator创建折叠动画。

3. 在主窗体上放一个新的TLayout控件，使其align为left，然后在里边分别放一个TRectangle、TVertScrollBox，几个TLabel组件，以及相应的按钮。Structure和表单结构如下图。

注意：需要为TRectangle容器指定Hight为250，接下来编程时会进行控制。

首先在代码中的uses区中添加“FMX.Ani”,这是TAnimation和TAnimator组件所在的单元。

接下来为按钮事件添加如下的事件处理代码：

procedure TFormMain.BtnActionClick(Sender: TObject);
begin
  // 使用 if 语句判断名为 RctAnimate 的矩形控件的当前高度是否等于 250 像素
  // 这个值代表矩形的"展开"状态高度
  if RctAnimate.Height = 250 then
  begin
    // 如果当前是展开状态（高度为250），则执行折叠动画

    // 使用 FireMonkey 的 TAnimator 类来创建并执行一个浮点属性动画
    // 参数1 (RctAnimate): 指定要应用动画的目标对象，这里是 RctAnimate 矩形
    // 参数2 ('Height'): 指定要动画化的属性名称，这里是高度属性
    // 参数3 (100): 动画的结束值，将高度动画变化到 100 像素（折叠状态）
    // 参数4 (0.8): 动画的持续时间，单位为秒，表示动画将在 0.8 秒内完成
    // 参数5 (TAnimationType.&In): 动画的缓动效果类型。&In 表示动画开始时较慢，然后加速
    //      (& 符号是必需的，因为 'In' 是 Delphi 的保留关键字)
    // 参数6 (TInterpolationType.Linear): 插值类型。Linear 表示线性插值，即数值均匀变化
    TAnimator.AnimateFloat(RctAnimate, 'Height', 100, 0.8,
                          TAnimationType.&In, TInterpolationType.Linear);

    // 动画开始后，同时更新按钮的显示文本为"展开"
    // 这为用户提供了视觉反馈，表明下次点击此按钮将会执行展开操作
    BtnAction.Text := '展开';
  end
  else // 如果 RctAnimate 的高度不等于 250 像素（即当前处于折叠或其他状态）
  begin
    // 执行展开动画，将矩形的高度从当前值动画变化到 250 像素

    // 使用相同的 TAnimator.AnimateFloat 方法，但目标值改为 250
    TAnimator.AnimateFloat(RctAnimate, 'Height', 250, 0.8,
                          TAnimationType.&In, TInterpolationType.Linear);

    // 将按钮的文本更新为"折叠"，提示用户下次点击将会折叠矩形
    BtnAction.Text := '折叠';
  end;
end;

运行效果如下所示：

可以看到简单几行代码应实现了动画的折叠效果。

Show Scroll Bar复选框用来确定是否为TVertScrollBox显示滚动条，代码如下所示：

procedure TFormMain.CheckBox1Change(Sender: TObject);
begin
  if CheckBox1.IsChecked = True then
    VertScrollBoxClient.ShowScrollBars := CheckBox1.IsChecked
  else
    VertScrollBoxClient.ShowScrollBars := CheckBox1.IsChecked;
end;

3.TAnimator与其他的动画组件的区别在哪里？

• TAnimator像一个临时工，你叫他来完成一个一次性任务（动画），他干完活就走，不留痕迹。特点是简单、快捷、无需管理。

• TAnimation 组件像一个正式员工，你需要雇佣（创建）他，给他安排详细的岗位职责（配置属性），并且要管理他的去留（生命周期）。特点是功能强大、可配置性高、需手动管理。

1. 当在如下情形时，选择TAnimator:

• 动画很简单，只是一次性的属性变化。

• 你不想在设计中拖放太多组件。

• 你想保持代码的简洁性，避免管理动画对象的麻烦。

• 动画是动态触发的，且参数可能每次都不一样。

1. 当在如下情形时，选择 TAnimation 组件：

• 动画是UI设计的重要组成部分，需要在设计时就预览效果。

• 动画需要循环播放、自动反转、或者与其他动画串联。

• 你需要精确控制动画的起始值、结束值。

• 你需要在动画完成时执行特定的代码（使用 OnFinish 事件）。

• 同一个动画会被多次重复使用。

TAnimator提供了如下的方法：

• AnimateFloat 方法会随时间通过特定的插值方式动画化浮点数属性值。
• AnimateFloatDelay 方法与 AnimateFloat 方法类似，但它会在开始过程前添加一个初始延迟。
• AnimateInt 方法会随时间通过特定的插值方式动画化整数的数值属性值。
• AnimateColor 方法会随时间对颜色属性值进行动画处理，并使用特定的插值方式。
• AnimateFloatWait 方法与 AnimateFloat 方法类似，但它是同步执行的（方法调用只有在动画过程结束后才会返回）。
• AnimateIntWait 方法与 AnimateInt 方法类似，但它是同步执行的（方法调用只有在动画过程结束后才会返回）。

总结

虽然TAnimator非常简洁，但它封装了创建、配置、启动和销毁动画对象的全部细节，只给你留下一个最简单的接口。所以其实满足很多场景需求。

TAnimation组件适合于创建较为复杂的动画效果，就比如在《一步一步学习使用FireMonkey动画（1）》中的案例，你可以在多个动画组件之间进行协调显示，这是TAnimator无法实现的。