# QPropertyAnimation 动画框架 —— 教学补充示例 > 对应方案书「C++方向 Day4」:"QT 动画框架(QPropertyAnimation)与状态机实战" > 里的动画部分(状态机部分见 [`../state_machine/`](../state_machine/README.md))。 > 仓库 `p03/` 的 wiki 抓取内容里没有动画相关代码,本示例是手工补写的教学补充, > **不属于** `tools/gen_part3.py` 的生成产物。 ## 概念 `QPropertyAnimation` 能直接对 Qt 的**属性系统**(`Q_PROPERTY`,比如 `geometry`、`windowOpacity`、`pos`)做插值动画,不需要手写定时器 + 每帧计算 坐标/透明度再手动调用 `update()`。三个关键参数: - `setStartValue()` / `setEndValue()` —— 起止值; - `setDuration()` —— 动画时长(毫秒); - `setEasingCurve()` —— 缓动曲线,控制"匀速/加速/回弹"等运动节奏 (`QEasingCurve` 提供几十种预设曲线)。 动画对象默认不会自动播放,需要显式 `start()`;`start(QAbstractAnimation::DeleteWhenStopped)` 可以让动画播放完自动 `delete` 自己,不用手动管理生命周期。 ## 代码走读 见 [`qt_property_animation.cpp`](qt_property_animation.cpp): 1. 一个按钮初始位置在左上角 `QRect(10, 10, 100, 30)`; 2. `QPropertyAnimation` 绑定按钮的 `"geometry"` 属性,800ms 内从起始矩形动画到 右下角的 `QRect(180, 140, 120, 40)`(位置和大小同时变化); 3. `QEasingCurve::OutBounce` 让动画结束时有一个"回弹"的视觉效果, 直观体现"缓动曲线改变的是运动节奏,不是起止值"; 4. 离屏验证等待 1100ms(比动画时长 800ms 多留 300ms 余量)再退出,确保动画 真的播放完整。 ## 验证方式 ```bash QT_QPA_PLATFORM=offscreen tools/run_qt.sh qt_property_animation ``` 有 X 环境直接运行可以看到按钮从左上角带回弹效果移动到右下角。 ## 练习方向(供任务卡引用) - 把 `QEasingCurve::OutBounce` 换成 `QEasingCurve::Linear`/`InOutQuad`, 对比运动节奏的差异; - 再加一个 `QPropertyAnimation` 动画 `windowOpacity`(从 1.0 到 0.3),用 `QParallelAnimationGroup` 让位置动画和透明度动画同时播放。 ## 参考 - Qt 官方文档:*Animation Framework*、*QPropertyAnimation*(doc.qt.io,选读·需联网)