Unityに関連する記事です

 現在はタイル上をどこでも自由に移動が行えてしまうため、タイル(地形)による、プレイヤーキャラの移動できる範囲の制限を行います。


<実装動画>
動画ファイルへのリンク


 以下の内容で順番に実装を進めていきます。

手順8 ープレイヤーキャラの移動範囲の制限ー
13.Tilemap とプレイヤーキャラにコライダーを設定して、移動範囲を制限する
14.滑らかな移動が行えるように改善を行う



 新しい学習内容は、以下の通りです。

 ・Tilemap Collider 2D コンポーネント
 ・Composite Collider 2D コンポーネント



13.Tilemap とプレイヤーキャラにコライダーを設定して、移動範囲を制限する

1.設計


 タイルマップ上には様々な地形のタイルが設置されています。
そのため地形の状態に合わせてプレイヤーキャラの移動を制限した方がよいものがあります。
例えば、川や高い山といった地形は、プレイヤーキャラでは移動できない地形として判断されることが多いでしょう。

 ここではタイルに対してプレイヤーキャラの移動範囲を制限するための実装を行います。



 移動を制限する方法としては対象となるゲームオブジェクトとプレイヤーキャラのゲームオブジェクトにそれぞれコライダーを持たせて
そのコライダー同士がぶつかる場合には移動を制限するという方法が一般的です。
今回もこの方法を応用して、タイルとプレイヤーキャラとにコライダーを持たせるようにします。

 タイルの場合、タイル1つずつではなく、タイル自体にコライダーの設定をすることが出来ます。
そのため、川のタイルを5つ設置したら、それらすべてに1つずつコライダーを手動で設定するのではなくて、
川のタイルを設置したら、それにはすべてコライダーが自動的に設定される、という形式です。

 つまり、地形(タイル)ごとに予めコライダーを設定することが出来ます。
そしてそれを指定しておけば、あとは設置された際にタイルに自動的にコライダーの機能が付与される仕組みです。

 まずは最初に、移動の制限をしたいタイルを選択して、それらにコライダーの設定を行います。
その後、プレイヤーキャラにもコライダーの設定を行って、コライダー同士がぶつかって移動が制限されるかを確認していきます。


2.移動させたくない地形のタイルにコライダーの設定を行う


 TileMaps/Fields フォルダ内にあるタイルを確認します。


フォルダ画像



 各地形のタイルが格納されていますので、まずはこれらの中で、プレイヤーキャラを移動させたくないタイルを1つ選択します。
具体的には、Grid_Collison ゲームオブジェクトの子オブジェクトの Tilemap 内に設置したタイルが対象になると思います。


Sceneビュー画像 Grid_Collison ゲームオブジェクト/ Tilemap ゲームオブジェクト内に設置されているタイル群



 インスペクターを確認すると、Collider Type という設定項目が見つかりますので、Sprite => Grid に変更をしてください。

 今回は海のタイルを1つ選択して設定している状態です。


タイル インスペクター画像



 選択するファイルはタイルのファイルです。Texture の画像ファイルではありませんので、間違えないようにしてください。
(タイルのファイルでないと、上記のようなインスペクター画像は表示されません。)



 他にも設定したいタイルがあると思いますので、それらの設定をまとめて行います。
 
 コライダーの設定を行いたいタイルを ctrl キーを押しながら左クリックして複数選択してください。
この状態でインスペクターの Collider Type を設定すると、選択しているすべてのタイルに設定が反映されます。


複数のタイルにまとめて設定する


 
 以上で設定は完了です。


3.Grid_Collison ゲームオブジェクトの Tilemap にコライダーを設定する


 ヒエラルキーにある Grid_Collison ゲームオブジェクトの子オブジェクトの Tilemap ゲームオブジェクトを選択します。


ヒエラルキー画像



 インスペクターの一番下にある Add Component を選択し、Tilemap Collider 2D コンポーネントを探して追加してください。


インスペクター画像



 このコンポーネントがアタッチされている Tilemap 内のタイルのうち、
Collider Type が Sprite か Grid に設定されているタイルに自動的にコライダーが設定されます。

 Collider Type によってコライダーの形状が変化し、Sprite の場合には画像に沿ったコライダー(山の画像なら、山の稜線にそったコライダー)、
Grid の場合にはマス目単位でコライダーが設定されます。None の場合にはコライダーは設定されません。

 今回、この Tilemap 内のタイルには、事前に移動を制限したいタイルのみ Grid にて設定をしているはずですので、
それらにすべてコライダーが設定されることになります。Sceneビューを確認してください。


Sceneビュー画像 各タイル1つずつにコライダーが設定されている



参考サイト
Unity公式マニュアル
Tilemap Collider 2D
https://docs.unity3d.com/ja/2018.4/Manual/class-Ti...


 タイルマップを複数のレイヤー構造にしている理由の1つとして、 Tilemap 単位でのコライダーの設定が可能であることがあげられます。
コライダーを設定したい Tilemap と、それ以外の Tilemap というように分離して準備しておくことによって、
今回のコライダーの設定のように、先々に行う作業や設定が楽に行えるような設計でゲームを製作しています。
ゲーム製作に慣れてきたら、設計の部分にしっかりと時間をかけておくと、このようにスマートな実装が可能になります。

 以上でタイル側のコライダーの設定は完了です。


4.Player ゲームオブジェクトにコライダーを設定する


 ヒエラルキーにある Player ゲームオブジェクトを選択して、インスペクターの一番下にある Add Component を選択します。
Box Collider 2D コンポーネントを探して追加してください。


インスペクター画像





 追加したらコライダーのサイズの設定を行います。
キャラと同じ大きさでもよいですが、下半分くらいにだけコライダーを設定することで、ゲーム画面内の移動がよりゲームっぽくなります。
自分の考えているイメージでキャラが移動できるかどうかを基準に設定をしてみてください。


コライダーのサイズ設定



コライダーのサイズによる対比 (キャラの半分の場合) 移動できない山の半分までをキャラが移動できる



コライダーのサイズによる対比◆(キャラと同じサイズの場合) 移動できない山にはキャラが移動できない



 細かいことですが、自分の遊んできたゲームがどんな風だったかをおもいだしながら設定を行うといいでしょう。
あとはゲームを実行しながら設定を調整していってください。



5.ゲームを実行して動作を確認する


 タイルとプレイヤーキャラの双方のコライダーが設定できましたので、ゲームを実行してコライダー同士が接触し、
移動できないタイルがあるかどうかを確認していきましょう。

 
<実装動画>
動画ファイルへのリンク


 移動しているとわかりますが、タイルとタイルのつなぎ目にキャラが引っかかるような場合があります。
次の手順ではそれを改善して、スムースに移動が行えるように設定を行います。


14.滑らかな移動が行えるように改善を行う

1.設計


 フィールドやダンジョンなどの移動は多くのゲームで重要な役割を持ちます。
そのため、なるべくユーザーが遊びやすい状態を考えて設計を行っていく必要があります。

 今回のプレイヤーキャラの移動ですが、タイルに設定したコライダーとの接触判定がぎこちなく、移動する際にひっかかって移動が阻害されることがあります。
これはゲームの状態としても、またユーザーの遊びやすさとしても、双方にとって良い状態ではありませんので、改善を行う必要があります。

 何か1つ実装を行ったらそれで終わり、ではなくて、必ずデバッグを行います
その中で問題点がないか、改善箇所はないかを見極めるスキルを養っていきながら、ゲームをよりよくするためのブラッシュアップを行います。

 今回のケースでは、タイル同士のコライダーのつなぎ目にプレイヤーキャラのコライダーがぶつかって
その部分でひっかかりが生じて、移動できなくなってしまう部分に原因があります。

 Unity には隣り合うコライダーを1つにまとめることができる機能がありますので、そちらを利用して改善を行っていきます。


2.原因の解明と解消方法を検討する −隣接するコライダー同士を連結して処理を軽くするとともに、移動をしやすくするー


 今回の不具合の原因として考えられるのは、タイル同士が隣り合っていてもコライダーは異なるコライダーが1つずつ設定されているため、
この部分にキャラが接触すると引っかかって移動する際に不具合が生じていると思われます。


現在のタイルのコライダー



<検証動画>
動画ファイルへのリンク



 
 この現象が原因なのだとすれば、隣り合うタイル同士を連結させることによって解消することができます。
また、連結することにより、コライダーの数が減少するため、処理の負荷も軽減することが出来ます。

 Grid_Collison ゲームオブジェクトの子オブジェクトである Tilemap ゲームオブジェクトを選択し、
インスペクターの一番下にある Add Component を選択します。Composite Collider 2D コンポーネントを探して追加してください。
追加すると自動的に Rigidbody2D コンポーネントも追加されます。
 
 この Composite Collider 2D コンポーネントが、複数のコライダーを連結する機能になります。
なお連結できるコライダーは 2D のみで、Box Collider 2D コンポーネントか、Polygon Collider 2D コンポーネントのいずれかになります。
今回利用している Tilemap Collider 2D コンポーネントの場合、タイルに個々設定されるコライダーは Box Collider 2D コンポーネントであるため、適用範囲になっています。


参考サイト
Unity公式マニュアル
CompositeCollider2D
https://docs.unity3d.com/ja/2019.4/Manual/class-Co...



 設定する項目は2つです。追加した Composite Collider 2D コンポーネント自体には変更はありません。

 最初に、Tilemap Collider 2D コンポーネントの Used By Composite のスイッチにチェックを入れて有効にします。
これで、追加した Composite Collider 2D コンポーネントの機能が有効化されます。


インスペクター画像



 次に、Rigidbody2D コンポーネントの Body Type を Static に変更します。
これでコライダーが連結して作用するようになります。


インスペクター画像



 以上で設定は完了です。



 Sceneビュー でコライダーの形状を確認してください。
タイル1つ1つに設定されていたコライダーが、隣り合うコライダー間で1つの大きなコライダーとして連結されていることが分かります。


<Composite Collider 2D コンポーネント 設定前>



<Composite Collider 2D コンポーネント 設定後>



 以上で設定は完了です。


3.ゲームを実行して動作を確認する


 ゲームを実行してキャラをコライダーのあるタイルにぶつけてみてください。
先ほどとは異なり、コライダーにひっかかることなく、スムースに移動ができるようになっていれば制御成功です。


<実装動画>
動画ファイルへのリンク


 実装の結果を見て、原因として考えていた内容があっていたのか判明します
もしも今回の実装でも同じようにキャラがひっかかってしまうのであれば、それは別の原因ということになるためです。
その場合には検証を進めて、何が原因として考えられるのか、問題点を1つずつ切り分けながら見極めていくことになります。
そういったスキルを身につけるためにも、デバッグを行うことは重要な作業になります。

 以上でこの手順は終了です。

 次は 手順9 −カメラの追従制御の実装− です。

コメントをかく


「http://」を含む投稿は禁止されています。

利用規約をご確認のうえご記入下さい

Menu



プログラムの基礎学習

コード練習

技術/知識(実装例)

2Dおはじきゲーム(発展編)

2D強制横スクロールアクション(発展編)

3Dダイビングアクション(発展編)

2Dタップシューティング(拡張編)

レースゲーム(抜粋)

2D放置ゲーム(発展編)

3D脱出ゲーム(抜粋)

2Dリアルタイムストラテジー

2Dトップビューアドベンチャー(宴アセット使用)

3Dタップアクション(NavMeshAgent 使用)

2Dトップビューアクション(カエルの為に〜、ボコスカウォーズ風)

3Dトップビューアクション(白猫風)

VideoPlayer イベント連動の実装例

VideoPlayer リスト内からムービー再生の実装例(発展)

AR 画像付きオブジェクト生成の実装例

AR リスト内から生成の実装例(発展)

private



このサイト内の作品はユニティちゃんライセンス条項の元に提供されています。

管理人/副管理人のみ編集できます