如何在FMX的TSkAnimatedImage中加载Lottie动画文件？

TSkAnimatedImage是Skia4Delphi提供的FireMonkey组件，专门用于渲染Skia支持的动画（包括Lottie），和普通TImage的加载逻辑不同，需针对Lottie的JSON格式文件采用特定方式加载，以下分设计时和运行时两种场景说明：

一、设计时加载 #

1. 确保项目已引入Skia4Delphi相关包（安装Skia4Delphi后通常会自动配置）。
2. 将TSkAnimatedImage组件拖放到FMX窗体上。
3. 在Object Inspector中找到AnimationSource属性，点击右侧编辑按钮，选择本地的Lottie JSON文件。
4. 可将AutoPlay属性设为True，让程序启动后自动播放动画；设置Loop属性控制是否循环播放。

二、运行时加载 #

1. 从本地文件加载 #

使用LoadFromStream方法，指定动画类型为TSkAnimationSourceType.Lottie：

uses Skia, Skia.FMX, Classes;

procedure TForm1.FormCreate(Sender: TObject);
var
  LottieFileStream: TFileStream;
begin
  // 替换为你的Lottie JSON文件路径
  LottieFileStream := TFileStream.Create('D:\Animations\loading.json', fmOpenRead);
  try
    SkAnimatedImage1.LoadFromStream(LottieFileStream, TSkAnimationSourceType.Lottie);
    SkAnimatedImage1.Play; // 手动启动播放
    SkAnimatedImage1.Loop := True; // 设置循环播放
  finally
    LottieFileStream.Free;
  end;
end;

2. 从嵌入资源加载 #

如果希望将Lottie文件打包到程序内部，可先将其作为资源嵌入：

• 在项目的.rc资源文件中添加如下内容（替换路径和资源名称）：

  LOADING_ANIM RCDATA "D:\Animations\loading.json"
  

• 编译资源后，在代码中从资源流加载：

uses Skia, Skia.FMX, Classes;

procedure TForm1.FormCreate(Sender: TObject);
var
  ResourceStream: TResourceStream;
begin
  ResourceStream := TResourceStream.Create(HInstance, 'LOADING_ANIM', RT_RCDATA);
  try
    SkAnimatedImage1.LoadFromStream(ResourceStream, TSkAnimationSourceType.Lottie);
    SkAnimatedImage1.AutoPlay := True;
  finally
    ResourceStream.Free;
  end;
end;

注意事项 #

• Lottie动画文件必须是JSON格式（由AE导出的Lottie标准文件），若文件无法加载，可先用Lottie官方预览工具验证文件合法性。
• 确保使用的Skia4Delphi版本与当前Delphi版本兼容，避免API差异导致的问题。
• 若需控制动画播放状态，可调用Play、Pause、Stop等方法。

内容的提问来源于stack exchange，提问作者Martin Kakhuis