ステージを作ろう のバックアップ(No.5)


Tilemap

それではステージを作っていきましょう
ありがたいことにUnityにはTilemapというものが標準的に備わっていて、簡単にマップを作ることができます。
ヒエラルキーを右クリックして、2D object>Tilemap>Rectangular を押してください

 
Tilemapを追加.png
 

画面に格子状の線が出てきましたね。この画面では画像を簡単に張り付けることができます。それでは地面の画像を追加していきましょう。

 
tiles.png
 

この画像を保存して、UnityのほうのAssetsにドラッグ&ドロップしてください。

 
tiles画像を追加.png
 

このままでは一枚の画像としか認識されないので、画像をスライスしていきたいと思います。画像のtile_mapを選択して、InspectorのspritemodeをMultipleに変更してください。

 
multipleに変更.png
 

これで画像を切り分けられるようになりました。InspectorのSprite Editorを押してください。この時、警告が出るのでApplyを押してください。

 
画像をスライス1.png
 

左上のSliceから自動的に画像を分けることができます。今回はグリッドごとに分けたいので、「Grid by cell size」を選んでください。この時、PixcelSizeのxとyを32にしてから、Suliceを押してください。

 
画像をスライス2.png
 

そして、Tilemapに合わせるため、InspectorからPixels Per Unitの数値を100から32に変更してください。

 
Pixcel per Unitを変更.png
 

まだマップを作る準備は終わっていません。次はタイルパレットを作っていきます。画面上部から、Windows>2d>Tilepaletteを選択してください。

 
tilepalette起動!.png
 

その後、Tilepalatteの画面から、Create New Paletteを押して、新しいパレットを作成してください。特にこだわりがなければ、そのまま保存してください。

 

それでは、maptaletteにマップチップを追加しましょう。スライスした画像ををパレットにドラッグ&ドロップしてください。

 
マップチップを追加da.png
 

これでマップを作る準備ができました。マップチップを選択して、Seane上をなぞると画像を配置することができます。
地面の画像はいろいろ用意されているので、自由に配置してみましょう。

 
マップ制作3.png
 

とりあえず適当にマップを作ってみました。
見た目はできてきますが、今の状態だと当たり判定がありません。この画像に当たり判定を付けてみましょう。
tilemapのインスペクターのadd componentでtilemap collider2dを検索して出てきたものをクリックしてください。

 
tilemapcollider2dを追加da.png
 

これで、それぞれのグリッドの画像それぞれに当たり判定がつきました。この当たり判定を一つにまとめることができます。
tilemapに、さらにComposize collider 2D を追加してください。
その後、tilemap collider 2Dのused by composizeにチェックを入れると当たり判定がまとまります。

 
collidercomposizeを追加da.png