漢武強化開発ログ(1)-ATlas、TMP、ポイントUI作成

暗いモードで読むことをお勧めします.

퇴사하고 두달동안 면접에서 광탈 몇번..
사실상 놀았으니, 다시 현업으로 돌아갈 준비를 한다.

놀면서 로아를 참 열심히 많이 했는데, 거기서 영감을 받아
도트풍의 방치형 게임을 만들어볼까 한다.

1인개발이니, 그래픽은 직접 도트로 다 찍어야 한다.
회사에선 UI 담당자가 만들어준 아틀라스 받아서 드래그 몇번이면 끝나던 UI도
아틀라스 제작부터 설정까지 다 찾아보고 헤딩해야한다.

이곳에는 여러 의미로, 그 과정을 기록할것이다.
겸사겸사, 불특정 다수를 위한 강의의 목적도 조금은 있다.

atlasに作成、インポート、および追加します。

その場合、必要な画像を自分で撮影する必要があります.そのため、
とがった歯を使用することにしました.
たとえば、ボタンにアクセスするにはUIが必要です.

このようにタイムリーに作成して使用する方法です.
ドットを撮ってからUnityを導入しましょう
UIを強化するための画像なので、Asset/UI/Encantフォルダを作成しました.

右側のインスペクタから理解するオプションはいくつかあります.

Pixel Per Unit
個室ビューを拡大すると、複数の格子に分かれて見えます.
Pixel Per Unitはこの格子にいくつかの画素を入れることができます.
上記で作成したButton 1(16 x 16)によれば、Pixel Per Unitは16である.
1コマあたり16画素が必要なので、16 x 16画像のButton 1に適しています.

Mesh Type
画像ファイルは長方形で、実際の画像と透明な部分(透明)が含まれています.
Mesh Type(完全復元、Tight)は、実際の画像をレンダリングするときに透明な部分をどのように処理するかのオプションです.
全Rectで埋め尽くし、Tightは透明部分を取り除きます.

Filter Mode
ポイントを使用しないとポイントが破壊されます.

このようにして作成されたドット画像は、Sprite Atlasで使用される.
簡単に言えば、画像を使用するために、ファイルからメモリにアップロードする操作をbatchと表すことができ、n個の画像をロードするにはn回batchが必要である.
事前に写真をSprite Atlasという大きな弁当箱に入れておけば、冷蔵庫からこの弁当箱(batch)を1つ出せば、中の写真が見えます.
しかしSprite Atlas自体は容量が大きいため、用途が似ているUIの間でしか組み合わせられません.

同様に、UIを強化するためのAtlasであるため、Asset/UIにEnchantというAtlasが作成される.

ポイント画像を使用するため、Filter ModeをPoint、CompressionをNoneに設定します.
TextMeshPro(TMP)のフォントリソースの作成
ドットスタイルに合ったドットフォントがおすすめです(えんすいけい).

フォントファイルをAsset/Fontフォルダにインポートすると、TMPリソースを作成し、TextMeshProコンポーネントをオブジェクトに追加し、作成したフォントリソースを適用できます.

Sliceオプションの使用
Button、Dialogなどの実際のゲームに表示されるUIは、さまざまなサイズがあります.
しかし、各サイズの画像については、作業効率の低下と容量の浪費をもたらす.
このとき使えるのがSliceオプションです.このオプションを使用すると、10 x 10サイズのUIに5 x 5サイズの画像を入れても、不足している部分が自動的に増加します.
この場合、個別のOutlineを設定しないと、画像のすべての部分が必要に応じて増加するので、私たちが望む形状は現れません.
画像ファイルをクリックし、InspectorウィンドウでSprite Editorボタンをクリックします.

緑の線がOutlineです.
その線の外側はそのままで、内部だけを増やします.このようにすると、どのUIの横と縦の長さにおいても、実際には同じような形で画像が表示される.
(上のフォント参照)