SOUI 动画系统¶
Warning
The current page still doesn't have a translation for this language.
You can read it through google translate.
SOUI 提供了丰富的动画支持,允许开发者为控件和界面元素创建流畅的动画效果。本文档将介绍 SOUI 中的两种主要动画类型:基础动画(Animation)和值动画(ValueAnimator)。
基础动画(Animation)¶
基础动画是应用于控件的动画效果,例如透明度变化、旋转、平移和缩放等。这些动画直接作用于控件的视觉属性。
动画类型¶
SOUI 提供了几种预定义的动画类型:
- SAlphaAnimation: 透明度动画
- SRotateAnimation: 旋转动画
- STranslateAnimation: 平移动画
- ScaleAnimation: 缩放动画
- SAnimationSet: 动画集合,可以同时播放多个动画
动画属性¶
所有基础动画都有一些共同的属性:
| 属性 | 描述 |
|---|---|
| duration | 动画持续时间(毫秒) |
| startOffset | 动画开始前的延迟时间(毫秒) |
| fillEnable | 是否启用填充效果 |
| fillBefore | 动画开始前是否应用变换 |
| fillAfter | 动画结束后是否保持变换 |
| repeatCount | 动画重复次数 |
| repeatMode | 重复模式(restart 或 reverse) |
| zAdjustment | 动画期间的 Z 调整模式 |
| interpolator | 插值器,控制动画的速度曲线 |
使用示例¶
基础动画可以通过 XML 或代码方式定义:
<!-- 在 XML 中定义动画 -->
<alpha duration="1000" fromAlpha="0.0" toAlpha="1.0" />
<rotate duration="500" fromDegrees="0" toDegrees="360" />
<translate duration="800" fromXDelta="0" toXDelta="100" />
<scale duration="600" fromXScale="1.0" toXScale="2.0" />
// 在代码中创建动画
SAlphaAnimation* alphaAnim = new SAlphaAnimation(0.0f, 1.0f);
alphaAnim->setDuration(1000);
值动画(ValueAnimator)¶
值动画是 SOUI 中更强大的动画系统,它不直接操作控件属性,而是生成随时间变化的值,开发者可以根据这些值来更新界面。
值动画类型¶
SOUI 提供了多种预定义的值动画类型:
- SIntAnimator: 整数动画
- SFloatAnimator: 浮点数动画
- SPointAnimator: 点坐标动画
- SSizeAnimator: 尺寸动画
- SRectAnimator: 矩形动画
- SColorAnimator: 颜色动画
值动画属性¶
值动画具有以下主要属性:
| 属性 | 描述 |
|---|---|
| duration | 动画持续时间(毫秒) |
| repeatCount | 动画重复次数 |
| repeatMode | 重复模式(restart 或 reverse) |
| interpolator | 插值器,控制动画的速度曲线 |
| valueFrom | 动画起始值 |
| valueTo | 动画结束值 |
使用示例¶
值动画的使用方式如下:
<!-- 在 XML 中定义值动画 -->
<IntAnimator duration="1000" valueFrom="0" valueTo="100" repeatCount="1" />
<ColorAnimator duration="2000" valueFrom="FF0000" valueTo="00FF00" />
// 在代码中使用值动画
SIntAnimator* intAnimator = new SIntAnimator();
intAnimator->setRange(0, 100);
intAnimator->setDuration(1000);
intAnimator->addUpdateListener(this); // 添加更新监听器
intAnimator->start();
插值器(Interpolator)¶
插值器用于控制动画的变化速率。SOUI 提供了多种内置插值器:
- LinearInterpolator: 线性插值
- AccelerateInterpolator: 加速插值
- DecelerateInterpolator: 减速插值
- AccelerateDecelerateInterpolator: 先加速后减速插值
- AnticipateInterpolator: 开始时向后然后向前抛掷
- OvershootInterpolator: 向前抛掷并超过终点后回到终点
- AnticipateOvershootInterpolator: 开始时向后,然后向前抛掷并超过终点后回到终点
动画监听器¶
可以通过设置监听器来响应动画事件:
- IAnimationListener: 基础动画监听器
- IAnimatorListener: 值动画监听器
- IAnimatorUpdateListener: 值动画更新监听器
// 动画监听器示例
class MyAnimationListener : public IAnimatorUpdateListener {
public:
void onAnimationUpdate(IValueAnimator* animator) {
SIntAnimator* intAnimator = (SIntAnimator*)animator;
int value = intAnimator->getValue();
// 使用动画值更新界面
}
};
动画组¶
可以使用 SAnimatorGroup 来管理一组动画,实现复杂的动画序列或并行动画效果。
SAnimatorGroup* group = new SAnimatorGroup();
group->AddAnimator(animator1);
group->AddAnimator(animator2);
group->SetListener(this);
group->start();
最佳实践¶
- 合理使用动画,避免过度使用影响用户体验
- 选择合适的插值器以获得自然的动画效果
- 注意动画性能,特别是在低端设备上
- 对于复杂的动画序列,考虑使用动画组进行管理
- 及时释放动画资源,避免内存泄漏