​
App Inventor 2 动画教程

覆盖：属性动画、补间动画、视图动画、动画监听、动画序列

​
一、动画基础

​
1.1 动画类型

类型说明使用场景
属性动画改变对象真实属性位移、缩放、旋转
视图动画只改变显示效果简单转场
帧动画连续图片Loading动画

​
二、属性动画

​
2.1 位移动画

// 使用动画扩展
当 按钮_移动.被点击 时
  调用 动画1.移动到(标签_目标, 100, 200, 1000)

​
2.2 缩放动画

当 按钮_缩放.被点击 时
  调用 动画1.缩放(标签_图片, 1.5, 1.5, 500)

​
2.3 旋转动画

当 按钮_旋转.被点击 时
  调用 动画1.旋转(标签_图片, 360, 1000)

​
2.4 透明度动画

当 按钮_淡入.被点击 时
  调用 动画1.透明度(标签_目标, 1, 500)

当 按钮_淡出.被点击 时
  调用 动画1.透明度(标签_目标, 0, 500)

​
三、动画监听

​
3.1 动画完成回调

当 动画1.动画完成 时（组件）
  调用 对话框1.显示消息对话框("动画完成", "提示", "确定")

​
3.2 动画更新回调

当 动画1.动画更新 时（组件, 属性, 值）
  如果 属性 = "X" 则
    设置 标签_调试.文本 = "X: " + 值

​
四、动画序列

​
4.1 顺序执行

定义 顺序动画()
  调用 动画1.移动到(标签_目标, 100, 0, 500)
  调用 动画1.移动到(标签_目标, 100, 100, 500)
  调用 动画1.移动到(标签_目标, 0, 100, 500)
  调用 动画1.移动到(标签_目标, 0, 0, 500)

​
4.2 同时执行

定义 同时动画()
  调用 动画1.同时执行(
    创建列表(
      创建字典(键值对("组件", 标签_A), 键值对("属性", "X"), 键值对("目标值", 100)),
      创建字典(键值对("组件", 标签_B), 键值对("属性", "X"), 键值对("目标值", 200)),
      创建字典(键值对("组件", 标签_C), 键值对("属性", "缩放"), 键值对("目标值", 1.5))
    ),
    1000
  )

​
五、实战：点赞动画

​
5.1 心跳效果

定义 心跳动画()
  调用 动画1.同时执行(
    创建列表(
      创建字典(键值对("组件", 按钮_点赞), 键值对("属性", "缩放"), 键值对("目标值", 1.3)),
      创建字典(键值对("组件", 按钮_点赞), 键值对("属性", "透明度"), 键值对("目标值", 0.8))
    ),
    300
  )
  
  调用 动画1.同时执行(
    创建列表(
      创建字典(键值对("组件", 按钮_点赞), 键值对("属性", "缩放"), 键值对("目标值", 1.0)),
      创建字典(键值对("组件", 按钮_点赞), 键值对("属性", "透明度"), 键值对("目标值", 1.0))
    ),
    300
  )

当 按钮_点赞.被点击 时
  调用 心跳动画()

​
六、常见问题

​
Q1：动画不流畅？

使用硬件加速，减少复杂计算

​
Q2：动画中断？

在页面切换时停止动画

​
Q3：内存泄漏？

及时移除动画监听器
文档版本：2026.03 | 作者：App Inventor 2 中文网 www.fun123.cn

​
参考资料与版权声明

​
原文来源

​
版权声明

本文档基于 MIT App Inventor 官方文档及社区资源整理，版权归原作者所有：
  • MIT App Inventor 官方文档采用 CC BY-SA 4.0 授权
  • MIT App Inventor Community 帖子版权归原作者所有
本文档由 ai2claw 🐝 整理，仅供学习参考，如有侵权请联系删除。