目次
●はじめに
2D横スクロールアクション作成を目指し、「タイルマップ」を使ってマップ作成してみます。
「タイルマップの紹介」という形で投稿し、いつでも失踪できるようキリ良くいきます。
タイルマップは結構色々できますが、とりあえず編集開始できるまでの手順を書いていきます。
アセットは無料公開されている「Warped Caves」をお借りします。
↑これが完成します。
●プロジェクト準備
▷プロジェクト作成
・解説
2Dテンプレートでプロジェクトを作成します。
2Dテンプレートにすることで、2D機能の１つ「タイルマップ」機能を使えるようにします。
・手順
①UnityHubを起動
②「新しいプロジェクト」をクリック
③中央の一覧にある「2D」をクリック
④右下のプロジェクト名に「SideACT」を入力
⑤「プロジェクトを作成」をクリック
▷マイアセット登録
・解説
アセットストアから「Warped Caves」をお借りします。
メト○イドっぽい。
・手順
①アセットストアの「Warped Caves」にアクセス
②「マイアセットに追加」をクリック
▷アセットインポート
・解説
「Warped Caves」をプロジェクトにインポートし、ファイルを扱えるようにします。
・手順
①Unityメニューの「ウィンドウ＞パッケージマネージャー」をクリック
②パッケージマネージャー左上の「パッケージ：＊＊＊＞マイアセット」をクリック
③パッケージマネージャー左側の一覧にある「Warped Caves」をクリック
④パッケージマネージャー右下の「ダウンロード」をクリック
⑤パッケージマネージャー右下の「インポート」をクリック
⑥Import Unity Package右下の「インポート」をクリック
●タイルマップ準備
▷スプライト調整
・解説
１６ドットを１ユニットとして扱うようにします。
１６ドット✕１６ドットで出来ているタイルを１枚として配置できるようになります。
・手順
①プロジェクトの「Assets>Warped Caves>Artwork>Environment>tileset-sliced」をクリック
②インスペクターの「ユニット毎のピクセル数」に(16)を入力
③インスペクターの「適用する」をクリック
▷パレット作成
・解説
タイルマップで扱うアセット、「パレット」を作成します。
パレットは分割したスプライト「タイル」を管理するアセットです。
・手順
①プロジェクトの「Assets」を右クリック
②「作成＞2D＞タイルパレット＞矩形」をクリック
③”Palette”と入力し、ENTERキーを押す
▷タイル作成
・解説
スプライトを１６ドット✕１６ドットのタイルとして分割します。
沢山作られるため、見失わないよう「Tiles」フォルダにまとめて配置します。
・手順
①Unityメニューの「ウィンドウ＞2D＞タイルパレット」をクリック
②プロジェクトの「Assets>Warped Caves>Artwork>Environment>tileset-sliced」をタイルパレットの中央部分にドラッグ＆ドロップ
③Generate tiles into folderで開かれている階層の３つ上のフォルダ、「***/SideACT/Assets」に移動
④左上の新しいフォルダー」をクリック
⑤「Tiles」を入力し、ENTERを押す
⑥右下の「フォルダーの選択」をクリック
●タイルマップ作成
▷タイルマップ作成
・解説
タイルを表示するゲームオブジェクト、「タイルマップ」を作成します。
このタイルマップに対してタイルを配置していきます。
・手順
①ヒエラルキー左上の「＋」をクリック
②「2Dオブジェクト＞タイルマップ＞矩形」をクリック
▷タイルマップ編集
・解説
タイルをクリックした位置に配置したり、箱状に配置、塗りつぶしたりしてマップを作成します。
・手順
シーン上にカーソルを持っていくと配置プレビューが見えるので、それを参考にしつつマップを作成しましょう。
①タイルパレット上部の筆アイコン「Paint with active brush (B)」をクリック
②タイルパレット中部のタイルをクリック ～ 描画タイルの選択
③シーン上のタイル配置したい場所をクリック ～ タイルの配置
④タイルパレット中部のタイルをドラッグ ～ 描画タイルの複数選択
⑤シーン上のタイル配置したい場所をクリック ～ タイルの配置
▷コライダー設定
・解説
衝突機能を持ったコンポーネント、「Tilemap Collider 2D」を設定します。
・手順
①ヒエラルキーの「Grid>Tilemap」をクリック
②インスペクターの「コンポーネントを追加」をクリック
③「Tilemap>Tilemap Collider 2D」をクリック
衝突判定の処理に時間がかかってしまうため、コライダーをまとめて扱ってくれるコンポーネントを設定します。
また、マップは物理的な影響を受けないよう「キネマティック」にします。
①インスペクターの「コンポーネントを追加」をクリック
②「Physics 2D>Composite Collider 2D」をクリック
③インスペクターの「Tilemap Collider 2D>コンポジットで使用」をチェック
④インスペクターの「Rigidbody 2D>ボディタイプ」を「キネマティック」に変更
●動作確認
▷球作成
・解説
動作確認のため、球を作成します。
・手順
①ヒエラルキー左上の「＋」をクリック
②「2Dオブジェクト>スプライト>サークル」をクリック
▷球設定
・解説
球が衝突、落下するようにコンポーネントを設定します。
・手順
①インスペクターの「コンポーネントを追加」をクリック
②「Physics 2D>Circle Collider 2D」をクリック
③インスペクターの「コンポーネントを追加」をクリック
④「Physics 2D>Rigidbody 2D」をクリック
⑤Circleはタイルマップの内側に配置
▷動作確認
・解説
プレビューしながら球を好きな位置に動かし、凹凸に合わせて衝突することを確認します。
・手順
①Unity上部中央の「▶」をクリック
②ヒエラルキーの「Grid>Circle」をクリック
③シーンの「ツール」にある「移動ツール」をクリック
④シーン上のCircleにある青四角をドラッグ＆ドロップ
●完成
矩形タイプのタイルマップを作成しました。
パレット、タイル、タイルマップ、グリッド、タイルマップコライダー…、
登場人物が多すぎて面倒かも知れないけど、これだけでも結構楽しい。
タイルごとの衝突設定、オートタイル、グリッド形状など、
タイルマップが持つ機能はまだまだありますが。
さて、やはり横スクロールアクションはキャラクターを動かさないと始まらない。
次回はキャラクターを動かそう。
コメント