コガネブログさんで紹介されているスタイルタグを使ってルビ（ふりがな）を振る方法を参考に、コンポーネント化したものを作りました。
TextMeshProRubyコンポーネント目次
ダウンロード
後述する『TMP_Typewriter』と統合した最新版はこちらです
使い方
TextMeshProRubyコンポーネントを付ける
TextMeshProのコンポーネントが付いているGameObjectにTextMeshProRubyコンポーネントを付けて下さい。
テキスト入力欄に文字を入力すると、タグが展開された状態でTextMeshPro側のテキストにコピーされます。
ルビは次のようにして付けます。
ルビタグ上に貼ったgifのように、コンポーネントの位置はTextMeshProの1つ上に移動させておく（右クリックしてMoveUp）と入力しやすいです。
TextMeshProRubyのチェックを外すと自動コピーが止まります。基本的にはないと思いますがタグ展開が終わった後のテキストをいじりたいことがあったら使用して下さい。
行間の固定
(2019/12/17追記) こちらを参考に、行間を固定する機能を追加しました。
行間が固定されたテキストルビが1つでも入った行は行間が広がりますが、思いがけず広がりすぎてレイアウトが崩れてしまうこともあると思います。
行間を固定したい時は Fixed Line Height のチェックを付けて下さい。
Fixed Line Height & Auto Margin Topこの行間固定は、2行目以降に対してしか効きません。
そのため、1行目はルビの有無を見て TextMeshPro側の設定 Extra Settings中の MarginTop を調整しています。
MarginTopMarginTopを別の用途で利用したい場合はデフォルトで付いている Auto Margin Top のチェックを外して下さい。
MarginTopを使わない場合でも、テキストを下揃えにすることで行間を固定するのと同じ効果を得ることができます。
行間を固定した場合はルビが入ることを想定して行間を広めにとっておいて下さい。TextMeshPro側の設定 Spacing Options中の Line で行間を増減できます。
スクリプト上からの操作
3パターンあります。
TextMeshProRubyを経由
TextMeshProRubyコンポーネントが付いている場合は、こちらを経由できます。
var tmpRuby = GetComponent<TextMeshProRuby>();
tmpRuby.Text = "<r=もじ>文字</r>";TMP_Textに直接セット
拡張メソッドを利用してセットできます。
var tmpText = GetComponent<TMPro.TMP_Text>();
tmpText.SetTextAndExpandRuby("<r=もじ>文字</r>", fixedLineHeight: false, autoMarginTop: true);タグ変換したテキストだけ取得
var text = TMProRubyUtil.GetExpandText("<r=もじ>文字</r>");1文字ずつ表示するアニメーションを作る
(2022/10/26追記) こちらの「TMP_Typewriter」のルビ対応版を作りました。
アニメーションGitHubにてダウンロードできます。
注意点
ルビを振る対象を途中で改行できない
途中に改行を入れてしまうとタグを正しく認識できません。
また行幅の制限によって自動で改行されてしまう時にルビの表示自体はされますが、ルビが全て次の行に表示されるので見た目的にはあまりよろしくありません。
AutoSizeを使ったりWrappingをDisableにするなどして、自動での改行を防いだ方が安全です。
ただしAutoSizeによって文字が小さくなりすぎてルビが読めなくなる可能性もあるので、行自体が長くなりすぎないよう注意です。
等幅フォントに対してしか使えない
文字幅が固定であることを前提に作っているため、半角文字やプロポーショナルフォントに対しては利用できません。
jp-netsisさん作のRubyTextMeshProではプロポーショナルフォントに対してもルビを振ることができます。他にも細かい調整が可能なので、設定にこだわりたい方はこちらがオススメです。
CharacterSpacingを使うとルビがずれる
文字間隔の変更にルビ位置の対応ができていません。
対応は入れたいのですが少々大変なので後回しになっています。
コンポーネント化した理由
コガネブログさんで紹介されている方法のようにスタイルシートにタグを追加する方法を使わなかった理由としては、タグを追加する方法では何文字の漢字に対して何文字のルビを振るかによって全通りのタグを用意する必要があるためです。
例えば2文字の漢字に対して5文字のルビを振るということを想定していなくてタグを用意していなかった場合は使えません。
これを全て考慮するのは大変なので、スクリプト上の計算によって文字の前後に入れるスペースやルビの位置を計算し、直接スタイルタグへと変換するようにしました。
