Skip to content

Latest commit

 

History

History
250 lines (151 loc) · 13.7 KB

File metadata and controls

250 lines (151 loc) · 13.7 KB

Fang Auto Tile

English version

Fang Auto Tile は Unity で使用できる簡単で高機能なオートタイルシステムです。

2024-01-01 16-44-32_re mkv

output

🏔️ 概観

  • 効率性: Fang Auto Tile はたった5パターンのタイル素材からすべての隣接状況に対応した47のタイルパターンを自動的に生成します。
  • パフォーマンス: Fang Auto Tile には強力な Packer システムがあり、複数のタイルから生成されたスプライトを一つのテクスチャにパッキングすることができます。これは描画パスを削減し、GPUパフォーマンスを向上するのに役立ちます。
  • 高機能: アニメーション、ランダム、スロープ、サブチャンネルなどの便利な機能があります。

📜 目次

🔥 インストール

要件

  • Unity 2021.3 以降

UPM git dependencies 経由でのインストール

Package Manager から次の git URL を追加してください:

https://github.com/ruccho/FangAutoTile.git?path=/Packages/com.ruccho.fang-auto-tile

Asset Store 経由でのインストール

アセットページはこちら (アップデートには時間差があります): https://assetstore.unity.com/packages/tools/sprite-management/fang-auto-tile-132602

サンプル

Package Manager からサンプルをインポートできます。

👉 Quick Start

1. タイルシートを作成する

テンプレートをダウンロードするか, 次のサイズの画像を作成します:

  • : タイルサイズ
  • 高さ: タイルサイズ * 5

タイルシートは次の5つのタイルを縦に並べます:

guide0

上の例では簡単のために色を付けており、実際には以下のように表示されます:

image

2. Unity にインポートする

タイルシートをインポートし、圧縮をNoneに設定します

Project ビューの Create メニューから Fang > Tileを選択して Fang Auto Tile のアセットを作成します。

作成したタイルアセットの Inspector を開き、次の必須の設定を行います:

Tile Generation Settings

  • Main Channel: インポートしたタイルシートをセットします。
  • One Tile Per Unit: 使用するタイルマップのサイズが1タイルにつき1 Unit の場合は有効にします。そのほかのサイズの場合はオフにするとカスタムのPPUを設定できます。

設定が完了したら Generate! ボタンをクリックします。

3. 使用する

タイルアセットを Tile Palette に配置して使用します。

⚙️ タイル設定

image

  • Frame Mode: 🎞️ アニメーション / ランダム の項で説明します。
  • Animation: 🎞️ アニメーション / ランダム の項で説明します。
  • Collision
    • None: タイルは当たり判定を持ちません。
    • Sprite: タイルはスプライトから自動的に生成された当たり判定を持ちます。
    • Grid: タイルはグリッドいっぱいの当たり判定を持ちます。
  • Is Slope: ⛰️ スロープ (実験的) の項で説明します。
  • Connectable Tiles: このタイルが接続しているとみなす、他の Fang Auto Tile を指定することができます。

Tile Generation Settings

これらの設定は生成のプロセスで使用され、リアルタイムに反映されません。変更を反映するためには再度 Generate! ボタンをクリックしてください。

  • Enable Padding: タイルの間に表示される不正線を防止します。生成されるテクスチャ上でタイルの外縁のピクセルを外側に拡大することで行われます。
  • One Tile Per Unit: タイルの大きさを 1 Unit に設定します。チェックを外すと手動で Pixels Per Unit を調整できるプロパティが現れます。
  • Physics Shape Generation
    • Sprite: スプライトの内容に応じて自動的に Physics Shape を生成します。
    • Fine: 幾何学的に単純な Physics Shape を生成します。
  • Wrap Mode: 生成されるテクスチャの Wrap Mode です。
  • Filter Mode: 生成されるテクスチャの Filter Mode です。
  • Num Slopes: ⛰️ スロープ (実験的) の項で説明します。
  • Main Channel: タイルシートをセットします。
  • Sub Channels: 💡 サブチャンネル の項で説明します。
  • Packer: このタイルで使用されている Packer です。 (📦 Packer の項で説明します。)

🎞️ アニメーション / ランダム

Fang Auto Tile はアニメーションタイルとランダムに見た目を変えるタイルをサポートしています。

これを行うためには、タイルシート上でフレームを横に並べます

template_frames_large

タイルシートから生成を行ったあと、Tile Settings の Frame ModeAnimation または Random に設定します。

Animation Settings

Frame Mode が Animation のとき、追加の設定が Tile Settings で可能です。

  • Animation Min Speed: ランダムなアニメーション速度の下限です。
  • Animation Max Speed: ランダムなアニメーション速度の上限です。
  • Animation Start Time: アニメーションの開始時間です。

💡 サブチャンネル

ノーマルマップやエミッションマップなどの複数チャンネルを使用することができます。

Fang Auto Tile はすべての隣接パターンに対応するタイルのスプライトを生成しテクスチャ上に焼きこみます。このテクスチャが実際のレンダリング時に使用されます。Fang Auto Tile で複数チャンネルを使用するためには、すべてのチャンネルが別々のテクスチャに焼きこまれる必要があります。

guide1

これを行うためには、Tile Generation Settings の Sub Channels プロパティをセットします。サブチャンネルにセットするテクスチャのサイズはメインチャンネルと同じにする必要があります。

image

再度 Generate! ボタンをクリックすると、生成された各チャンネルのテクスチャがタイルアセットのサブアセットとして現れます。

image

📦 Packer

Packer は複数タイルが生成したテクスチャを一つのテクスチャにパックできる機能です。これは描画パスを削減しパフォーマンスの向上に役立ちます。

Project ビューの Create メニューから Fang > Packer を選択し、Fang Auto Tile Packer アセットを作成します。

パッキングしたいタイルアセットを登録し Generate! ボタンをクリックします。

image

🤝 Connector Tiles

Connector Tile は、隣接する Fang Auto Tile に、同じタイルが接続していると誤認させることができる透明なタイルです。

例えば、Connector Tile は複数の分割されたタイルマップ上の Fang Auto Tile どうしをシームレスにつなげることができます。

guide2

Connector Tile を作成するには、Project ビューの Create メニューで Fang > Connector Tile を選択します。

Connector Tile は透明ですが、エディタ上でのみ色を付けて表示することができます。これは Inspector の Editor Tint プロパティで設定できます。

image

⛰️ スロープ (実験的)

image

Fang Auto Tile ではスロープを自動的に扱うことができます。

Note

スロープは実験的な機能であり、必要なタイルシートのフォーマット等は今後変更される可能性があります。

スロープのための追加のタイルをタイルシートに追加する必要があります。

guide2

スロープはサイズの小さい順に追加します。

最初はサイズが1のセクションで、タイルは以下の順に並べられます。

  1. ◢ 上る床
  2. ◣ 下る床
  3. ◤ 上る天井
  4. ◥ 下る天井

次はサイズが2のセクションですが、これ以降のセクションでは横方向(2x1)と縦方向(1x2)の両方のタイルが必要になります。スロープ形状の並び順はサイズが1のときと同様です。 それぞれのスロープ形状に対して、タイルは角から近い順に並べます。

Note

使用可能なスロープサイズは幅か高さが1のものに限定されます。 これは任意サイズのスロープ形状を自動的に解決することが非常に複雑になってしまうためです。

すべてのセクションを準備できたら、タイルシートに含まれるスロープセクションの数を指定した後、再び Generate! を行います。

image

また、Is Slope プロパティを有効にしてタイルがスロープであることを指定する必要があります。

image

📝 Override Tiles

スロープでは、どのタイルがスロープなのか・あるいはスロープではないのかを指定したいかと思います。Override Tile 使うことで、オリジナルの Fang Auto Tile アセットのバリアントを作成し、Is Slope プロパティをオーバーライドすることができます。

Override Tile を作成するには、Project ビューの Create メニューから Fang > Override Tile を選択します。

image

  • Original: オリジナルの Fang Auto Tile アセットをセットします。
  • Is Slope: オリジナルの Is Slope プロパティです。
  • Editor Tint: タイルマップ上でどのタイルがオーバーライドされているかを判別するために適用される乗算色。Edit Modeでのみ適用されます。

こちらはオーバーライドタイルの使用例です。(青いタイルが非スロープタイルとしてオーバーライドされています)

image

タイルシートのフォーマット

タイルシートのフォーマットは WOLF RPGエディターで使われているフォーマットのスーパーセットになっており、WOLF RPGエディターのために作成されたオートタイル素材をFang Auto Tileで使用することができます。

https://silversecond.com/WolfRPGEditor/