TextMesh Proでテキストの中に画像(Sprite Asset)を表示する方法【Unity】【TextMesh Pro】

この記事でのバージョン
Unity 2020.3.11f1

今回は言わずと知れたTextMesh Proを使って、

テキストの中に画像を表示する方法の紹介記事です！

ちなみに、記事中では以下のアセットを使っています。(画像だけ)

まずテキストの中に表示したい各画像を一枚の画像にまとめる必要があります。

そのまとめた画像をUnityにインポートしたらTexture TypeをSpriteにし、

Sprite ModeをMultipleにした後Sprite Editorボタンを押します。

そして開いたSprite Editorウィンドウで各画像を矩形で選択し、右下のNameで名前を付けます。

さらにその画像を選んだ状態でProjectの+ボタンから

TextMeshPro/Sprite Assetを選択し、Sprite Assetを作成、

そのSprite AssetをTextMeshProのExtra SettingsにあるSprite Assetに設定すれば準備完了です。

ちなみにTMP SettingsのDefault Sprite Assetに配置場所のパスと共に設定すると、

上記の各TextMeshProのSprite Assetへの設定は必要なくなります。

実際には使う時はSprite Editorで設定した名前か、画像の番号を使ってタグ付けするだけ。

ちなみに画像部分はTextMeshProの色やマテリアルの影響は受けません。

Corgi_0 : <sprite name="Corgi_0"> is Corgi !
sprite=0 : <sprite=0> is Corgi !

ただし、カラーコードで直接色を設定する事は可能です。

<sprite name="MoneyIcon"> 
<sprite name="MoneyIcon" color=#2361EA>
<sprite name="MoneyIcon" color=#EA2323>

なお、各画像の細かい表示位置等はSprite Assetから変更可能です。

(:3[kanのメモ帳]