Text Animate By Glyph
Applies staggered per-glyph translate, scale, opacity, wave, and bounce animation
intermediate
Since P00
Input Ports
Layout
1文字単位でアニメーションする `TextLayout`
Output Ports
Layout
1文字ごとの transform / opacity を更新した `TextLayout`
Parameters
| Name | Type | Default | Description |
|---|---|---|---|
| Progress | `Float` | `1.0` | 対象文字範囲に対する正規化進行度 |
| First Character | `Int` | `0` | 対象に含める先頭文字番号。`0 = 1文字目` |
| Last Character | `Int` | `4096` | 対象に含める末尾文字番号。入力 `TextLayout` に合わせて上限が自動調整される |
| Reverse | `Bool` | `false` | 対象文字範囲を末尾から先頭へ向かって処理する |
| Per-Character Delay | `Float` | `0.0` | 各文字に順番に追加する正規化遅延量 |
| Start X Offset | `Float` | `0.0` | 開始時に適用し、進行に応じて 0 へ戻る横オフセット |
| Start Y Offset | `Float` | `0.0` | 開始時に適用し、進行に応じて 0 へ戻る縦オフセット |
| Start Scale | `Float` | `1.0` | 開始時に適用し、進行に応じて 1.0 へ戻るスケール |
| Start Opacity | `Float` | `1.0` | 開始時に適用し、進行に応じて 1.0 へ戻る不透明度 |
| Wave Height | `Float` | `0.0` | 進行中に加えるサイン波の縦揺れ量 |
| Wave Cycles | `Float` | `1.0` | `progress = 0..1` の全体で何周期ぶん波を進めるか |
| Bounce Height | `Float` | `0.0` | 各文字のローカル進行度に沿って 1 回だけ上に跳ねる量 |
どう考えればいい？
TextLayoutは「どこに文字を置くか」を持つTextAnimateByGlyphは「その文字ごとにどう動かすか」を上書きする- 最後に
TextRasterize v2やTextOutlineでimageへ焼く
1文字単位の考え方
- v1 の
glyphは実質1文字単位 先頭文字 = 0は1文字目末尾文字の上限は、入力されたTextLayoutの文字数に合わせて自動調整される
進行度の考え方
progressは0..1- 対象文字数が 11 文字なら、1 文字刻みは
1 / 11 staggerを 0 より大きくすると、各文字に順番に遅延が乗る
Technical Details
- このノードは
TextLayoutGlyph.visible / opacity / translate / scaleを更新した新しいTextLayoutを返す translate_x / translate_yは「開始位置から元の位置へ戻る」補間として使うstart_scale / start_opacityも「開始状態からNormal状態へ戻る」補間として使うwave_yは進行中にサイン波Offsetを追加するbounce_yは各文字ごとに 1 回だけ山なりの縦バウンスを追加するTextRasterize v2/TextOutline側でtranslate / scale / opacityを読んで描画する- 出力
TextLayoutは Inspector の文字レイアウト（デバッグ）で glyph index / bbox を確認できる
Usage Examples
[Text Input] -> [Text Layout] -> [文字アニメーション] -> [テキスト画像化] -> [Preview][Text Input] -> [Text Layout] -> [文字アニメーション] -> [文字アウトライン] -> [Preview]💡 Tips
- •このノードは `TextLayoutGlyph.visible / opacity / translate / scale` を更新した新しい `TextLayout` を返す
- •`translate_x / translate_y` は「開始位置から元の位置へ戻る」補間として使う
- •`start_scale / start_opacity` も「開始状態から通常状態へ戻る」補間として使う
- •`wave_y` は進行中にサイン波オフセットを追加する
- •`bounce_y` は各文字ごとに 1 回だけ山なりの縦バウンスを追加する
- •`TextRasterize v2` / `TextOutline` 側で `translate / scale / opacity` を読んで描画する
- •出力 `TextLayout` は Inspector の `文字レイアウト（デバッグ）` で glyph index / bbox を確認できる
Related Nodes
text-input
text-layout
preview