Unity でテトリス風ゲームを作ってみる（実装編）#2

Unity Version 2022.3.4

前回の続き

全体像の整理はできたので、各クラスの具体的な実装をユースケースごとに説明していく。

テトリミノの表示と落下

Tetrimino と Block は、動的に生成するためPrefab 化する。Prefab 化しておくと簡単にその複製（インスタンス）をスクリプト上から作成できるようになる。

Tetrimino Prefab の構成は下図のとおり。Tetrimino Prefab を親としBlock Prefab 4 つを子にするように親子関係を作る。こうすることで、Tetrimino Prefab を左右上下に動かせば、子であるBlock Prefabも一緒に動くため、Block Prefab を個別に操作する必要がなくなる。

また、キー入力イベントを受け取るため、Tetrimino Prefab にはPlayer Input コンポーネントもアタッチしておく。ブロックの表示自体は、Block Prefab で行うためTetrimino Prefab にはSprite Renderer コンポーネントをアタッチしていない。

次にBlock Prefab は、Sprite Renderer とBox Collider 2D コンポーネントだけをアタッチしている単純な構造する。スクリプトもアタッチする必要はない。

Box Collider 2D コンポーネントは、Raycastで検出できるようにするため必要。後ほど説明するが、Layer には "Tetrimino" レイヤーを作りそれを指定しておく。

NextArea.cs : Tetrimino 生成部

Tetrimino Prefab は、NextArea クラスが生成する。

生成する方法は単純で、Resources クラスを使ってPrefab asset をロードし、Object.Instantiate メソッドにてGameObject のインスタンス化を行う（MonoBehaviour クラスはObject クラスの派生クラスなので直接呼出しが可能）。

インスタンス化したテトリミノGameObject から GetComponent メソッドを使って Tetrimino にアタッチされている Tetrimino クラスのインタンスを取得する。

Tetrimino の種類はランダムに生成したいので、Random.Range メソッドにて乱数を生成し、Tetrimino.Type にキャストして、それをつかってTetrimino を初期化する。

最後に生成したテトリミノGameObject の画面上の位置をNextArea の中央に配置するように Transform のlocalPosition を設定してあげれば終了。

NextArea.cs の抜粋

// Tetrimino Object
private Tetrimino _next;
public void CreateNextTetrimino () {
_next = CreateTetriminoByRandom();
}
private Tetrimino CreateTetriminoByRandom () {
var prefab = Resources.Load("Prefabs/Tetrimino") as GameObject;
var copyObject = Instantiate(prefab, this.transform);
var next = copyObject.GetComponent<Tetrimino>();
var type = (Tetrimino.Type)UnityEngine.Random.Range(0, (int)Tetrimino.Type.MAX);
next.Init(type);
// set position in Center of NextArea
var width = next.GetWidth();
var height = next.GetHeight();
next.transform.localPosition = new Vector3(
(WIDTH - width) * 0.5f,
(HEIGHT - height) * 0.5f,
0);
return next;
}

Tetrimino.cs : ブロックの配置

テトリミノ内の4 つのブロックの位置は、種類と回転角の数だけ座標を配列として定義しておく。

テトリミノの種類は7 種類、回転角は4 種類（0度, 90度, 180度, 270度）で合計28 個。ちょっと面倒くさいが、地道に書き出した結果が下記。

Tetrimino.cs の抜粋

private readonly int [,,] TETRIMINO = new int [,,] {
new int[,,] { // I
{
{0,0}, {1,0}, {2,0}, {3,0} // 0
},{
{1,0}, {1,1}, {1,2}, {1,3} // 90
},{
{0,0}, {1,0}, {2,0}, {3,0} // 180
},{
{1,0}, {1,1}, {1,2}, {1,3} // 270
}
},
new int[,,] { // L
{
{0,0}, {1,0}, {2,0}, {2,1} // 0
},{
{1,0}, {1,1}, {1,2}, {0,2} // 90
},{
{0,0}, {0,1}, {1,1}, {2,1} // 180
},{
{0,0}, {1,0}, {0,1}, {0,2} // 270
}
},
new int[,,] { // J
{
{0,0}, {1,0}, {2,0}, {0,1} // 0
},{
{0,0}, {1,0}, {1,1}, {1,2} // 90
},{
{0,1}, {1,1}, {2,1}, {2,0} // 180
},{
{0,0}, {0,1}, {0,2}, {1,2} // 270
}
},
new int[,,] {
// T
{
{0,0}, {1,0}, {2,0}, {1,1} // 0
},{
{1,0}, {0,1}, {1,1}, {1,2} // 90
},{
{1,0}, {0,1}, {1,1}, {2,1} // 180
},{
{0,0}, {0,1}, {0,2}, {1,1} // 270
}
},
new int[,,] {
// S
{
{0,0}, {1,0}, {1,1}, {2,1} // 0
},{
{1,0}, {0,1}, {1,1}, {0,2} // 90
},{
{0,0}, {1,0}, {1,1}, {2,1} // 180
},{
{1,0}, {0,1}, {1,1}, {0,2} // 270
}
},
new int[,,] {
// Z
{
{1,0}, {2,0}, {0,1}, {1,1} // 0
},{
{0,0}, {0,1}, {1,1}, {1,2} // 90
},{
{1,0}, {2,0}, {0,1}, {1,1} // 180
},{
{0,0}, {0,1}, {1,1}, {1,2} // 270
}
},
new int[,,] {
// O
{
{0,0}, {1,0}, {0,1}, {1,1} // 0
},{
{0,0}, {1,0}, {0,1}, {1,1} // 90
},{
{0,0}, {1,0}, {0,1}, {1,1} // 180
},{
{0,0}, {1,0}, {0,1}, {1,1} // 270
}
}
};

実際にブロックを配置するには、種類（Tetrimino.Type）と回転（Tetrimino.Rotation）を配列のインデックスに変換して、4 つのブロック座標を示す配列データを取得する。

positions[i] = new Vector2Int(
TETRIMINO[(int)type][(int)rotation, i, 0], // X
TETRIMINO[(int)type][(int)rotation, i, 1]); // Y

それを使ってBlock Prefab のtransform.localPosition にVector2 形式で座標値を設定すればよい。ブロックのテクスチャを128 pixel で1 Unit に設定しているため、座標定義の値をそのままlocalPosition の値に代入すればOK。

Tetrimino.cs の抜粋

private void LocateBlocks () {
var positions = BlocksPosition(_type, _rotation);
var idx = 0;
foreach (var block in _blockPrefabs) {
block.transform.localPosition = new Vector2(positions[idx].x, positions[idx].y);
idx++;
}
}
private Vector2Int[] BlocksPosition (Type type, Rotation rotation) {
var positions = new Vector2Int[4];
for (var i = 0; i < 4; i++) {
positions[i] = new Vector2Int(
TETRIMINO[(int)type][(int)rotation, i, 0],
TETRIMINO[(int)type][(int)rotation, i, 1]);
}
return positions;
}

Tetrimino.cs : 落下

Tetrimino を1 ブロック分下に移動するには、単純にlocalPosition のY 座標を-1 すればよい（1ブロック分 128 pixel = 1 Unit になっているので）。

移動する前には、各ブロックの下方向にRaycast を打ってブロックがないことを確認する。

Physics2D.Raycat メソッドは、引数のバリエーションがいくつか存在するが、今回は複数のブロックを同時に検出する必要はないので、検出したCollider が1 つ戻り値として返るバージョンを使用している。

Raycat のスタート位置は自分自身の中心に設定。テクスチャのPivot を左下原点にしているので、ブロックの中心は縦、横方向にそれぞれ高さ、幅の1/2 を足した位置が中心となる。あとRaycast で指定する座標は絶対値指定なことに注意。

public static RaycastHit2D Raycast (

Vector2 origin, // Raycast の開始位置

Vector2 direction, // Raycast の向き

float distance= Mathf.Infinity, // Raycast の長さ

int layerMask= DefaultRaycastLayers, // 判定する対象のレイヤー

float minDepth= -Mathf.Infinity, // 判定する対象のZ軸方向の最初値

float maxDepth= Mathf.Infinity); // 判定する対象のZ軸方向の最大値

Raycast の長さについては、1 ブロック分だけ検出できればよいのでブロック幅の1/2 に設定する。LayerMask は、検出Collider をフィルタすることができるパラメータである。検出の必要な "Field" Layer だけを指定する（フィールドの枠で使うBlock オブジェクトや、フィールドに着地したBlock オブジェクトのLayer は Layer を"Field" に指定しているため）。Tetrimino にあるブロックは、上で説明したとおり "Tetrimino" Layer をしているので検出対象から除外される。

Tetrimino.cs の抜粋

// return true if collision is detected
private bool FreeFall () {
var isCollision = false;
foreach (var block in _blockPrefabs) {
if (CollisionCheck (block.transform, Vector2.down)) {
isCollision = true;
break;
}
}
if (isCollision) return true;
this.transform.localPosition = new Vector3(
this.transform.localPosition.x,
this.transform.localPosition.y - 1.0f,
this.transform.localPosition.z);
return false;
}
private bool CollisionCheck (Transform block, Vector2 direct) {
var start = new Vector2 (
block.position.x + block.lossyScale.x * 0.5f,
block.position.y + block.lossyScale.y * 0.5f);
var length = block.lossyScale.x; // ブロックは正方形なので、xとyの長さは同じ
var hit = Physics2D.Raycast (
start, // レイの原点
direct, // レイの方向
length, // レイの長さ
LayerMask.GetMask("Field") // チェックする対象を設定するフィルター
);
//Debug.DrawRay(start, direct * length, Color.red, 1f); // Debug用
return (hit.collider != null)? true : false;
}

フィールドの枠を生成する時に、Block オブジェクトのGameObject.layer プロパティに "Field" の値を設定しておく。

copyObject.layer = ScreenConfig.FIELD_LAYER;

Field.cs の抜粋

// Create Field Block Object from Prefab.
private void CreateFieldBlock (Vector2Int pos) {
var prefab = Resources.Load("Prefabs/Block") as GameObject;
var copyObject = Instantiate(prefab, this.transform);
copyObject.transform.localPosition = new Vector3(pos.x, pos.y, 0);
copyObject.layer = ScreenConfig.FIELD_LAYER;
_fieldBlocks.Add(copyObject);
}

Layer は、GameObject のLayer ドロップダウンリストから Add Layer を選択することで、自分で独自のものを追加できるようになる。下図のように"Field" を "User Layer 7" に指定したので、このLayer をプロパティで指定するときは、GameObject.layer にint型で7を設定すればOK.