この投稿では、Unity 6.1 & 2d-extras 4.2.0で利用可能になった「AutoTile」を紹介します。
概要
AutoTileは、2d-extrasのv4.2.0で追加されたScriptableTileです。「事前に定義したルール」と「隣接セル上における同一AutoTileの有無」により、表示するSpriteを自動的に切り替えることができます。例えば、次のようなマップを単一のAutoTileアセットで作成できます。
AutoTileに似たScriptableTileとして、RuleTileがあります。RuleTileは、次の図のように「表示するSpriteのルール」をInspector上で事前に定義します。
AutoTileは、次の図のように「表示するSpriteのルール」をInspector上でRuleTileよりグラフィカルに、より直観的に定義することができます。
なお、2d-extras v4.2.0はUnity 6.1以降に対応しています。そのためAutoTileを使うには、Unity 6.1以降を、使う必要があります。
AutoTileの作成・設定方法
画像素材：https://kenney.nl/assets/top-down-shooter
次のTexture内のSpriteを、隣接Tileの有無により、切り替えて表示し、
次のようなマップを、単一のアセットで作れるようなAutoTileの作り方を説明します。
まず、Project Windowの+ボタン > 2d > Tiles > Auto Tileを選択し、AutoTileを作成します。
Project Windowで作製したAutoTileアセットを選択し、Inspectorを開きます。
Mask Typeを「Mask_3x3」に切り替えます。Used Texturesに、Texture（Sprite）を設定します。
次のSpriteを表示するルールを、AutoTileのInspector上で設定します。このSpriteは、「隣接する右セルと下セルに、自身と同一のAutoTileアセットがある」ときに表示したいSpriteです。
AutoTileのInspector上で、対象Spriteの真ん中をクリックします。そうするとSpriteを9分割した真ん中の領域が赤くなります。
次に、対象Spriteにおける9分割した領域の右と下をクリックし、赤くします。赤い領域は「その方向の隣接セルに、同一のAutoTileが配置されている」というルール設定です。次の図ような状態になれば、「このSpriteを右セルと下セルに自身（真ん中）と、同一のAutoTileアセットがあるときに表示する」というルールを設定ができました。
次のSpriteを表示するルールを、AutoTileのInspector上で設定します。このSpriteは、「隣接する上セル、右斜め上セル、右セル、下セル、左セルに自身（真ん中）と、同一のAutoTileアセットがある」ときに表示したいSpriteです。
Inspector上、対象Spriteの上・右斜め上、右、下、左、真ん中をクリックします。次の図ような状態になれば「隣接する上セル、右斜め上セル、右セル、下セル、左セルに自身（真ん中）と、同一のAutoTileアセットがあるときに表示する」というルールを設定ができました。
同様の設定を、次の図のように表示したいすべてのSpriteに行います。
これで目的のAutoTileを作ることができました。
慣れが必要ですが、RuleTileよりもグラフィカルで、直観的にルール設定ができるのではないでしょうか。
なお、RuleTile、「上下左右のセル、どれかに同一RuleTileアセットが配置されていたら、Spriteを回転して表示」などの回転のルールや反転ルールを設定できました。残念ながらAutoTileは、回転・反転に対応していません。
Mask Typeについて
Mask Typeの「Mask_3x3」は、対象Spriteを9分割して
- 上
- 右上
- 右
- 右下
- 下
- 左下
- 左
- 左上
- 真ん中
をクリックして赤くマスクすることで、「その方向のセルに同一AutoTileが配置されているときに表示」というルールが設定されます。
Mask Typeの「Mask_2x2」は、対象Spriteを次のように4分割します。
- 右上
- 右下
- 左下
- 左上
例えば、右上をクリックして赤くマスクすると、「右・右上・上の3方向のセルに同一AutoTileが配置されているときに表示」というルールになります。つまり、4分割した各領域をクリックして赤くマスクしたとき、次のようなルールが設定されます。
- 右上・・・右・右上・上方向の隣接セルに配置されている
- 右下・・・右・右下・下方向の隣接セルに配置されている
- 左下・・・左・左上・上方向の隣接セルに配置されている
- 左上・・・左・左下・下方向の隣接セルに配置されている
異なる画像で同じルールのAutoTileを作成する
「画像（Texture）を変えて、同じルールのAutoTileアセットを作りたい」という場面があります。
例えば次のように全く同じサイズ・全く同じSprite配置の異なる画像（Texture）があり、片方の画像1だけAutoTileアセットを作成済みで、もう片方の画像2でもAutoTileを作成したい、という場面を考えます。
| 画像1 | 画像2 |
|---|---|
 |
 |
もう片方の画像2でも、全く同じ操作をしてAutoTileを作成するのは面倒です。実は、とても簡単に同じルールのAutoTileを作成できます。
すでに作成済みのAutoTileがAssets直下に、FirstAutoTileという名前であると仮定します。FirstAutoTileアセットのインスペクターを開き。Templateの右にある、Saveボタンを押します。
するとファイル保存のダイアログが開くので、適切なパス・適切な名前で保存します。ここでは、Assets直下に「MyAutoTilteTemplate」という名前で保存します。
新しいAutoTileアセットを作成します。ここでは、Assets直下に「SecondAutoTilte」という名前で保存します。作成したSecondAutoTilteの「Used Textures」に画像（Texture）を設定します。ここで設定する画像（Texture）は、まだAutoTileを作成していない画像2です。また、Mask Typeを「Mask_2x2」から「Mask_3x3」に変更します。
SecondAutoTilteのインスペクター、Templateの右にあるLoadボタンを押します。
ファイルを指定するダイアログが開くので、先ほど作成した「MyAutoTilteTemplate」を選択します。すると、SecondAutoTilteにもFirstAutoTileと同じルールが設定されます。
SecondAutoTileのインスペクターが、FirstAuoTileと同じように赤くマスクされていることに注目してください。
このように、全く同じ操作をしなくても、異なる画像で同じルールのAutoTileアセットを簡単に作成することができます。
リンク
画像素材：https://kenney.nl/assets/top-down-shooter
TileTemplateについて