高级效果
掌握基础标签映射后,你可以通过 UGlyphAnimation 关键帧编辑、FGlyphScheduleInfo 逐字时序与多图层合成创建更丰富的文字动画效果。
UGlyphAnimation 深层编辑
适用场景:在 Sequencer 中对文字动画进行关键帧级别的精确编辑。
UGlyphAnimation 是 UMovieSceneSequence 子类,双击资产在 Sequencer 中打开:
- 内容浏览器中双击字形动画资产(
UGlyphAnimation) - Sequencer 打开,显示该动画的时间轴
- 添加类型化子轨道(
UMovieSceneGlyphAnimationSection),编辑 FloatChannel 关键帧与曲线 - 蓝图节点
获取持续时间/获取轨道类型/是否有轨道类型查询资产属性
可编辑的 10 种轨道类型(21 通道)
| 轨道类型 | 通道数 | 说明 |
|---|---|---|
Opacity | 1 | 不透明度(默认 1.0) |
LetterSpacing | 1 | 字间距(像素) |
Rotation | 1 | 旋转角度(度) |
Translation | 2 | 位置偏移 X / Y(像素) |
Scale | 2 | 缩放 X / Y(默认 1.0) |
Shear | 2 | 剪切变换 X / Y |
Pivot | 2 | 枢轴 X / Y(默认 0.5) |
ShadowOffset | 2 | 阴影偏移 X / Y(像素) |
Color | 4 | 染色 R / G / B / A(A = 染色占比) |
ShadowColor | 4 | 阴影颜色 R / G / B / A |
TIP
最常用的通道组合是 Opacity + Translation + Scale + Rotation,覆盖大部分文字动画需求。染色(Color)通过 A 通道控制染色占比(A=1 完全染色)。
逐字时序控制
适用场景:调整每个字形的播放延迟与排程,控制逐字动画节奏。
调度 API
通过 UGlyphAnimationLayer 调度函数控制(Index = -1 作用于全部):
// 创建层(必须指定动画资产与混合模式)
TArray<FGlyphScheduleInfo> Schedule = FAnimationCompiler::BuildScheduleInfos(Text);
UGlyphAnimationLayer* Layer = UGlyphAnimationLayer::CreateLayer(
AnimAsset, ETextAnimationBlendMode::Override, Schedule);
// 逐字错峰
Layer->SetStartDelayAt(-1, 0.0f); // 起始延迟基准
Layer->SetDelayAt(-1, 0.05f); // 第 i 个字形延迟 = 0 + i × 0.05
Layer->SkipAt(-1); // 批量跳过
Layer->SetSkipAnimationAt(3, false);// 恢复第 3 个字形
逐字延迟示例
10 个字形、错峰 0.05s → 第 10 个字形在 0.45s 开始,总动画 ≈ 0.5s
NOTE
跳过(
SkipAt)仅跳过该字形的动画(静态显示),不跳过渲染——空白字符仍占据版面空间。空白/标点/CJK 分类可用IsWhitespaceAt/IsPunctuationAt/IsCJKAt/IsDecoratorAt查询。
多图层合成
适用场景:将多个 UGlyphAnimationLayer 烘焙合并为复合动画效果。
UGlyphAnimationFactory
// 1. 创建工厂(必须传入基础层 + 调度)
UGlyphAnimationFactory* Factory = UGlyphAnimationFactory::CreateFactory(BaseLayer, Schedule);
// 2. 添加图层(后添加的层级更高)
Factory->AddLayer(WaveLayer);
Factory->AddLayer(ShakeLayer);
// 3. 工厂级微调(作用于混合后的最终状态)
Factory->MultiplyTranslationAt(-1, FVector2D(1.5f, 1.0f));
// 4. 烘焙
FBakedStage Stage = Factory->Bake();
每个图层独立定义曲线与调度,合并时按 ETextAnimationBlendMode 决定混合方式:
| 模式 | 语义 | 典型用途 |
|---|---|---|
Override | 覆盖已有值 | 基础层 |
Additive | 叠加到已有值 | 抖动/波浪叠加层 |
Multiply | 与已有值相乘 | 全局调制 |
CrossFade | 与已有值插值 | 混合过渡 |
NOTE
默认实现约定:
GlyphAnimations[0]为基础层(Override),GlyphAnimations[1..N]为叠加层(Additive)。层创建时必须显式指定混合模式,不存在隐式默认值。
动画剪切
适用场景:裁掉动画曲线的前/后端,只保留有效区间。
Layer->SetAnimationClipAt(0.1f, 0.0f); // 跳过前 0.1s
Factory->SetAnimationClipAt(0.0f, 0.3f); // 工厂级:裁掉末端 0.3s
播放轴口径:前端裁剪 = 跳过开头,末端裁剪 = 提前结束;有限循环展开物化(只改最后一次循环)。
运行时阶段控制
适用场景:在蓝图或 C++ 中动态控制阶段播放。
UTextAnimationStageController 控制阶段播放流程:
- 手动路径:
FAnimationCompiler::BakeAllStages(BP, Text)→Initialize(&Baked, BP)→Play() - UMG 路径:控件自动完成,直接调用
播放节点 设置播放方向(EStagePlayDirection):Forward / Reverse / PingPong设置循环:阶段循环播放Tick 动画:每帧推进(控件自动)揭示所有:跳过动画直接显示全部文字
阶段状态查询
EStagePlaybackState 反映当前播放状态:
Stopped— 未播放Playing— 播放中Paused— 已暂停Complete— 播放完成
性能建议
适用场景:优化长文本或多字符动画场景下的运行时性能。
FBakedGlyph::Evaluate每帧为每个非静态字形求值——长文本(>100 字形)利用调度延迟让大部分字形处于”未开始/已完成”状态,减少活跃字形数- 烘焙由指纹缓存(
MinFramesBetweenRebakes = 3冷却)节流,运行时无重复烘焙 - 空通道跳过:删除未使用的轨道,减少求值通道数
- 富文本多条目:长对话拆分为短段落,使用
bSequentialPlayback顺序播放代替全部同时播放
TIP
对于长文本(>100 字形),建议拆分为多个段落,每段使用独立的
UAnimatedRichTextBlock控件,并按需播放而非全量常驻。