🕳️

UE5 ウィジェットブループリントで9Slice・9Patchの機能を使わない理由

2022/03/31に公開

9Sliceやら9Patchについて

9Slice Google検索結果 約 1,630,000 件
9Patch Google検索結果 約 1,290,000 件
エンジンやツールによっていくつか用語が乱れていると思うんですが、9Sliceが一番シェア高そうですかね?どちらも同じ手法のことではあるのですが、知らない人に説明するときに用語の選択に迷うこともあるので、以降は9Sliceとして説明しますが、どちらにしろUEのエディタ上でそんな表記は無いのでさらなる混乱を招いているとも思われます。
Unityだと9SliceSpritesというふうにマニュアルに記載されてますし。
Wikipediaでも9Sliceらしいです。
メリットはテクスチャサイズが小さくてすむので、アプリ容量とメモリの節約になるというものですね。ダイアログウィンドウの枠画像くらいにしか使わないような気もするし、端末の性能が高くなればこの節約自体があまり影響しないという可能性もあるので、マストで使いたい機能かという正直微妙です。
UE4でも開発初期には使っていたのですが、開発が進むうちに段々と使わなくなっていき、最終的には全部捨てました。設定が面倒だし変更に弱すぎるので、開発効率的にコスパが悪すぎるとの判断です。この点はUnityのTextureやSpriteEditorのデータ設計が柔軟で優れすぎているような気もしますが、Unityでは常に使用している機能なので、比較してしまうとUEの残念なところになります。

UE5での設定方法

そんな残念機能ですがUE5.0.0 Preview2で再確認しましたが、UE4からの進化はないようです。

UEでは「アピアランス>Brush>Draw as>Box」というプロパティになります。9Sliceとかじゃないので、初見で設定項目を発見するのはなかなか難易度が高いですね。
上下左右4方向のMarginを設定すると、テクスチャの1辺の長さを1として比率で設定するので、その指定部分のピクセルが引き伸ばされてスケーリングされるということになります。

マージンの設定が使用箇所ごとに個別

Unityと比較して、なぜ9Sliceを使用しないことにしたのかUEの残念なところを紹介しておきます。
UnityだとSpriteがMarginの設定を保持する[1]ため同じSpriteを再利用していくと共有の設定になります。開発中にあとから修正するときにはSpriteを編集すればすべてが一括で変更できます。
これがUEの場合はテクスチャのマージンを配置ごとに設定する必要があるので使用箇所での設定の面倒さもさることながら、あとからデザイン修正が必要になって変更しようとすると全部探して変えていかないといけないので、別途どこで使ったか管理しておくか、何か検索機能を自作する必要があります。
個別に設定する必要があるというところでは一応ひとつの対応策を考えたのですが、結局のところ面倒さは払拭できず。
テクスチャのファイル名にマージン値を名付けてしまうという荒業なのですが、例えばT_FrameImage_001-0_667_0_512_0_273_0_442みたいなファイル名にします。そのままマージン値にコピペする想定なので「0.667,0.512,0.273,0.442」が良いのですが、.と,がファイル名に相応しくないのであえなく_にして置換するという使い方です。ファイル名にするということはマージンを変更するときはファイル名を変える必要もあって、UEの各参照の管理の都合上でファイル名を修正するのはかなり勇気のいる作業なので別ファイルにするほうがまだ易しく、これも変更箇所が膨大になっていくととても扱いが難しくなりがちです。[2]
数とか種類などにもよるとは思うのですが、多いと管理が大変になるし、少ないならもう諦めれば良くないか?ということです。
以上のことからUEでは9Sliceを使わないことにしました。

脚注
  1. SpriteEditorのBorder設定 ↩︎

  2. UnityのGUIDでの管理が光るところですね ↩︎

Discussion