Appearance
Lottie 动画
Lottie 动画是一款轻量级、高性能的动画解决方案。天枢低代码应用支持添加 Lottie 动画组件用于播放 Lottie 动画，增强低代码应用的视觉效果和交互体验。
属性设置
Lottie 动画组件提供了丰富的属性配置选项，以下是一些关键属性配置说明。关于组件尺寸、位置、样式、指针、变换等通用属性的设置方法，请参考设置组件属性和事件。
内置丰富的动画库
Lottie 动画组件内置了丰富的动画资源库，你可以直接挑选并应用合适的动画效果。
自定义 Lottie 动画
支持从本地上传 Lottie JSON 文件并自动解析为 Lottie 动画。
循环播放
打开循环播放后，Lottie 动画会在界面加载时循环播放。
自动播放
打开自动播放后，Lottie 动画会在界面加载时自动播放。
隐藏组件
控制 Lottie 动画组件隐藏或显示的参数，支持在特定条件下隐藏 Lottie 动画组件。
设置为 false：显示组件。
设置为 true：隐藏组件。
设置为变量：通过变量值（true 或 false）动态控制图片组件的可见性。
例如在文本生成页面，添加了 Lottie 动画组件（Lottie1）和 Markdown 组件（Markdown1），Lottie 动画组件用于展示应用正处于文本生成状态中，Markdown 组件用于展示生成的文本内容。为了实现当 Markdown 组件开始输出内容时，自动隐藏 Lottie 动画组件的效果，你可以在 Lottie 动画组件的可见性属性中，添加变量{{ Markdown1.content }}。当文本组件中开始输出文本内容时，{{ Markdown1.content }} 值变为 true，Lottie 动画组件将自动隐藏。
生成文本后，Lottie 动画组件被隐藏。
事件设置
通过配置 Lottie 动画组件的事件，可以为 Lottie 动画组件添加丰富的交互功能，以增强用户体验和界面的互动性。
| 事件项 | 说明 |
|---|---|
| 事件类型 | 支持以下事件类型： 点击时：当用户点击 Lottie 动画组件时触发。 加载时：当 Lottie 动画组件完成加载时触发。 播放完成时：当 Lottie 动画播放完成时触发。 |
| 组件方法 | 支持以下方法： 播放：播放 Lottie 动画。 停止：停止 Lottie 动画。 暂停：暂停 Lottie 动画。 设置隐藏：隐藏 Lottie 动画。 |
配置示例
城市天气画报模板为天枢官方模板，本案例基于城市天气画报模板，添加了 Lottie 动画，提升应用的交互体验。当使用者输入城市名，单击确认后，应用立即开始生成城市画报并自动播放 Lottie 动画，清晰地表达应用正在生成天气画报的状态中，使得界面交互更加生动友好。当应用生成天气画报后，Lottie 动画消失同时界面上展示城市天气画报。
具体效果图如下：
输入城市名称
开始生成图片时循环播放动画
生成图片后隐藏动画
输入城市名称
开始生成图片时循环播放动画
生成图片后隐藏动画
当前版本实操
本页使用独立的 Lottie 动画 示例页面，页面内不混放其他组件。
- 进入低代码应用的 用户界面，确认搭建类型为 桌面网页。
- 单击画布底部的 新建页面，创建一个空白页面。
- 在左侧 组件 面板中找到 Lottie 动画，单击或拖入当前页面。
- 切换到 结构 面板，确认该页面只包含当前 Lottie 动画 组件。
- 选中组件，在右侧 属性 面板中设置动画来源、循环、自动播放和隐藏条件。
- 检查画布中的实际显示效果，再使用页面顶部的预览入口验证交互。
