見出しを表示する。uGUI。文字の長さに合わせて背景のサイズ変更したい。

こういうの。


最初思いついたのは、

1. Image を Text の子に設定する。
2. Text に、Content Size Fitter を追加する。
3. すると、Imageがテキストより前に描画されて、テキストが見えない・・・。

ダメだったので
他の方法を探しました。

1. Text を Image の子に設定する。

2. Image に、Horizontal Layout Group を追加する。

「Child Controls Size」　 の、　「Width」　をオンにする。　他はオフ。

3. Image に、Content Size Fitter を追加する。

「Horizontal Fit」　を　「Preferred Size」　にする。

設定は以上です。
あとは、

テキストを中央揃えにして

padding とか設定すると良いと思います。

参考

Unity - Manual: Making UI elements fit the size of their content
UI 要素をコンテンツサイズに合わせる - Unity マニュアル
Best way to make a background panel for a Text that has a ContentSizeFitter - Unity Forum
Scaling background with text: Detecting horizontal overflow? - Unity Forum