【基本操作】的当てゲーム～完全手順【アクション】

落下してくるボールをフリッパーで弾き、的に当てるゲームです。

Unityのインストールからプロジェクト作成、基本操作、UI、スクリプトと触っていきます。

対象：初心者、Unityに初めて触る方
使用バージョン：Unity 2021.3
時間：45分

■オブジェクト作成

●球作成

▷球作成

球を作成し、位置を(-9, 10, 0)に設定します。

1. ヒエラルキー左上の「＋」をクリックし、「3Dオブジェクト＞スフィア」をクリック
2. 「Ball」と入力し、ENTERキーを押す
3. インスペクターのTransformにある縦の三点リーダーをクリックし、リセットをクリック
4. インスペクターのTransform>位置を(-9, 10, 0)に設定
5. CTRLキーを押しながらSキーを押す

▷カメラ設定

カメラの位置Zを(-30)に設定し、ゲームビューのアスペクト比を(9:16)に設定します。

1. ヒエラルキーの「Main Camera」をクリック
2. インスペクターのTransform>位置Zを(-30)に設定
3. CTRLキーを押しながらSキーを押す
4. ゲームビューの「FreeAspect」をクリック
5. 「9:16 Aspect」をクリック、無い場合は以降を操作
6. 左下の「＋」をクリック
7. ドロップダウン「タイプ」をクリックし、「アスペクト比」をクリック
8. 幅＆高さの「X」に(9)、「Y」に(16)を入力
9. 「OK」をクリック

▷色設定

球を青色に設定します。

1. プロジェクトの「Assets」を右クリックし、「作成＞マテリアル」をクリック
2. 「matBall」と入力し、ENTERキーを押す
3. インスペクターの「アルベド＞カラーバー」をクリックし、色ダイアログの16進数を「0000FF」に設定
4. 色ダイアログの右上にある「×」をクリック
5. プロジェクトの「matBall」をヒエラルキーの「Ball」にドラッグ＆ドロップ
6. CTRLキーを押しながらSキーを押す

▷物理設定

球を落下するように設定します。

1. ヒエラルキーの「Ball」をクリック
2. インスペクターの「コンポーネントを追加」をクリックし、「Physics>Rigidbody」をクリック
3. インスペクターの「Rigidbody>衝突判定」右のドロップダウンをクリックし、「連続的かつ動的」をクリック
4. CTRLキーを押しながらSキーを押す
5. エディタ上中央の「▶」をクリック
6. 球が落下することを確認
7. エディタ上中央の「▶」をクリック

●フリッパー作成

▷フリッパー作成

箱を作成し、位置(2, 0, 0)、回転(0, 0, 0)、スケール(4, 0.5, 1)に設定します。

1. ヒエラルキー左上の「＋」をクリックし、「3Dオブジェクト＞キューブ」をクリック
2. インスペクターの「Transform>位置」を(2, 0, 0)に設定
3. インスペクターの「Transform>回転」を(0, 0, 0)に設定
4. インスペクターの「Transform>スケール」を(4, 0.5, 1)に設定
5. CTRLキーを押しながらSキーを押す

▷フリッパーの階層化

空オブジェクトを作成してリセット、位置(-10, -14, 0)に設定し、Cubeを子に設定します。

1. ヒエラルキー左上の「＋」をクリックし、「空のオブジェクトを作成」をクリック
2. 「Flipper」と入力し、ENTERキーを押す
3. インスペクターのTransformにある縦の三点リーダーをクリックし、リセットをクリック
4. ヒエラルキーの「Cube」をヒエラルキーの「Flipper」にドラッグ＆ドロップ
5. ヒエラルキーの「Flipper」をクリック
6. インスペクターの「Transform>位置」を(-10, -14, 0)に設定
7. CTRLキーを押しながらSキーを押す

▷色設定

球を緑色に設定します。

1. プロジェクトの「Assets」を右クリックし、「作成＞マテリアル」をクリック
2. 「matFlipper」と入力し、ENTERキーを押す
3. インスペクターの「アルベド＞カラーバー」をクリックし、色ダイアログの16進数を「008000」に設定
4. 色ダイアログの右上にある「×」をクリック
5. プロジェクトの「matFlipper」をヒエラルキーの「Cube」にドラッグ＆ドロップ
6. CTRLキーを押しながらSキーを押す

▷フリッパー物理制御

フリッパーにリジッドボディを設定し、Is Kinematicをオン、衝突判定を連続的かつ動的に設定します。

1. ヒエラルキーの「Flipper」をクリック
2. インスペクターの「コンポーネントを追加」をクリックし、「Physics>Rigidbody」をクリック
3. インスペクターの「Rigidbody>Is Kinematic」をチェック
4. インスペクターの「Rigidbody>衝突判定」右のドロップダウンをクリックし、「連続的かつ動的」をクリック
5. CTRLキーを押しながらSキーを押す

▷フリッパー制御準備

スクリプトを作成してフリッパーに割り当てます。

1. プロジェクトの「Assets」を右クリックし、「作成＞C# スクリプト」をクリック
2. 「Flipper」と入力し、ENTERキーを押す
3. ヒエラルキーの「Flipper」をクリック
4. プロジェクトの「Assets>Flipper」をインスペクターの「コンポーネントを追加」にドラッグ＆ドロップ
5. CTRLキーを押しながらSキーを押す

▷フリッパー制御

スペースが押されていたら+4、押されていなかったら-4度ずつ回転、回転範囲は-20度～0度に制限します。

1. プロジェクトの「Assets>Flipper」をダブルクリック
2. Start関数のコメントより上にfloat型の変数「zAngle」を定義
3. Update関数に以下の処理を記述
4. ・スペースキーが押されていた場合、zAngleを4加算
5. ・スペースキーが押されていない場合、zAngleを4減算
6. ・zAngleの値を-20～0までに制限
7. ・現在の回転量を取得
8. ・Z回転量をzAngleで上書き
9. ・回転量をクォータニオンに変換
10. ・リジッドボディのMoveRotationを使い、クォータニオンを設定
11. Unityエディタのタイトルをクリック
12. エディタ上中央の「▶」をクリック
13. 開始時にフリッパーが傾くことを確認
14. スペースキーを押すとフリッパーが水平になるまで動くことを確認
15. フリッパーで球を弾けることを確認
16. エディタ上中央の「▶」をクリック

▷スクリプトの記述例

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Flipper : MonoBehaviour
{
    // float型の変数「zAngle」を定義
    float zAngle;

    // Start is called before the first frame update
    void Start()
    {
        
    }

    // Update is called once per frame
    void Update()
    {
        // スペースキーが押されているかチェック
        if (Input.GetKey(KeyCode.Space) == true) {
            // 押されていた場合、zAngleを４加算
            zAngle += 4;
        } else {
            // 押されていない場合、zAngleを４減算
            zAngle -= 4;
        }
        // zAngleの値を-20～0までに制限
        zAngle = Mathf.Clamp(zAngle, -20, 0);

        // 現在の回転量を取得
        Vector3 angle = transform.rotation.eulerAngles;
        // Z回転量をzAngleで上書き
        angle.z = zAngle;

        // 回転量をクォータニオンに変換
        Quaternion quat = Quaternion.Euler(angle);
        // リジッドボディのMoveRotationを使い、クォータニオンを設定
        GetComponent<Rigidbody>().MoveRotation(quat);
    }
}

●マト作成

▷銅マト作成

箱を作成してリセット、位置(10, -11, 0)、スケール(4, 8, 1)に設定します。

1. ヒエラルキー左上の「＋」をクリックし、「3Dオブジェクト＞キューブ」をクリック
2. 「Copper」と入力し、ENTERキーを押す
3. インスペクターの「Transform＞縦の三点リーダー」をクリックし、リセットをクリック
4. インスペクターの「Transform＞位置」を(10, -11, 0)に設定
5. インスペクターの「Transform＞スケール」を(4, 8, 1)に設定
6. CTRLキーを押しながらSキーを押す

▷銅マト色設定

箱を銅色に設定します。

1. プロジェクトの「Assets」を右クリックし、「作成＞マテリアル」をクリック
2. 「matCopper」と入力し、ENTERキーを押す
3. インスペクターの「アルベド＞カラーバー」をクリックし、色ダイアログの16進数を「DA744B」に設定
4. 色ダイアログの右上にある「×」をクリック
5. プロジェクトの「matCopper」をヒエラルキーの「Copper」にドラッグ＆ドロップ
6. CTRLキーを押しながらSキーを押す

▷銀マト作成

箱を作成してリセット、位置(10, 3, 0)、スケール(4, 6, 1)に設定

1. ヒエラルキー左上の「＋」をクリックし、「3Dオブジェクト＞キューブ」をクリック
2. 「Silver」と入力し、ENTERキーを押す
3. インスペクターの「Transform＞縦の三点リーダー」をクリックし、リセットをクリック
4. インスペクターの「Transform＞位置」を(10, 3, 0)に設定
5. インスペクターの「Transform＞スケール」を(4, 6, 1)に設定
6. CTRLキーを押しながらSキーを押す

▷銀マト色設定

箱を銀色に設定します。

1. プロジェクトの「Assets」を右クリックし、「作成＞マテリアル」をクリック
2. 「matSilver」と入力し、ENTERキーを押す
3. インスペクターの「アルベド＞カラーバー」をクリックし、色ダイアログの16進数を「C0C0C0」に設定
4. 色ダイアログの右上にある「×」をクリック
5. プロジェクトの「matSilver」をヒエラルキーの「Silver」にドラッグ＆ドロップ
6. CTRLキーを押しながらSキーを押す

▷金マト作成

箱を作成してリセット、位置(10, 15, 0)、スケール(4, 4, 1)に設定します。

1. ヒエラルキー左上の「＋」をクリックし、「3Dオブジェクト＞キューブ」をクリック
2. 「Gold」と入力し、ENTERキーを押す
3. インスペクターの「Transform＞縦の三点リーダー」をクリックし、リセットをクリック
4. インスペクターの「Transform＞位置」を(10, 15, 0)に設定
5. インスペクターの「Transform＞位置」を(4, 4, 1)に設定
6. CTRLキーを押しながらSキーを押す

▷金マト色設定

金マトを金色に設定します。

1. プロジェクトの「Assets」を右クリックし、「作成＞マテリアル」をクリック
2. 「matGold」と入力し、ENTERキーを押す
3. インスペクターの「アルベド＞カラーバー」をクリックし、色ダイアログの16進数を「FFD700」に設定
4. 色ダイアログの右上にある「×」をクリック
5. プロジェクトの「matGold」をヒエラルキーの「Gold」にドラッグ＆ドロップ
6. CTRLキーを押しながらSキーを押す

■ゲーム制御

●銅結果UI作成

▷結果テキスト準備

UIテキストを作成し、TextMeshProをインポートします。

1. ヒエラルキー左上の「＋」をクリックし、「UI＞テキスト – TextMeshPro」をクリック
2. TMP Importerの「Import TMP Essentials」をクリック
3. TMP Importerを閉じる
4. ヒエラルキーの「Text (TMP)」をクリック
5. F2キーを押して「TextCopper」と入力し、ENTERキーを押す
6. CTRLキーを押しながらSキーを押す

▷結果テキスト配置

RectTransformを「stretch – stretch」のマージン無しに設定します。

1. インスペクターのRectTransformを以下のように設定
2. ・左上のアイコン「アンカープリセット」をクリックし、右下の「stretch – stretch」をダブルクリック
3. ・「上下左右」を(0, 0, 0, 0)に設定
4. CTRLキーを押しながらSキーを押す

▷結果テキスト表示文字設定

表示文字を「Copper!」とし、太字/AudoSize/金色/中央表示に設定します。

1. インスペクターのTextMeshProを以下のように設定
2. ・「Text Input>テキスト入力」を「Copper!」に設定
3. ・「Main Settings>Font Style」の「B」をオンにする
4. ・「Main Settings>Auto Size」にチェックを入れる
5. ・「Main Settings>VertexColor」のカラーバーをクリックし、色ダイアログの16進数を「DA744B」に設定
6. ・色ダイアログの右上にある「×」をクリック
7. ・「Main Settings>Alignment」の「Center、Middle」をオンにする
8. CTRLキーを押しながらSキーを押す

▷結果テキストマテリアル設定

マテリアルのOutlineを細めのねずみ色に設定します。

1. インスペクターのマテリアルを以下のように設定（Extra Settingsの下）
2. ・Outlineにチェックを入れる
3. ・OutlineのThicknessを(0.2)に設定
4. ・OutlineのColorにあるカラーバーをクリックし、Rを(64)、Gを(64)、Bを(64)に設定

●銅結果UI表示

▷結果テキスト制御準備

スクリプトを作成して銅のマトに割り当て、結果テキストを無効状態に設定します。

1. プロジェクトの「Assets」を右クリックし、「作成＞C# スクリプト」をクリック
2. 「Result」と入力し、ENTERキーを押す
3. プロジェクトの「Assets>Result」をヒエラルキーの「Copper」にドラッグ＆ドロップ
4. ヒエラルキーの「TextCopper」をクリック
5. インスペクターのオブジェクト名左にあるチェックを外す
6. CTRLキーを押しながらSキーを押す

▷結果テキスト制御

球が衝突したら球が物理影響を受けないようにし、結果テキストを表示するように設定します。

1. プロジェクトの「Assets>Result」をダブルクリック
2. Start関数のコメントより上に「Unity側で編集可能なゲームオブジェクト型の変数」を定義
3. Update関数の下に「オブジェクトと衝突した時に呼ばれる関数」を定義
4. 「オブジェクトと衝突した時に呼ばれる関数」に以下の処理を記述
5. ・UIテキストを有効化
6. ・衝突オブジェクトが物理影響を受けないように設定
7. Unityエディタのタイトルをクリック
8. ヒエラルキーの「Copper」をクリック
9. ヒエラルキーの「Canvas>TextCopper」をインスペクターの「Result>Ui Text」右側の枠にドラッグ＆ドロップ
10. CTRLキーを押しながらSキーを押す
11. エディタ上中央の「▶」をクリック
12. 球を銅のマトに当てたら「Copper!」と表示されることを確認
13. 球を銅のマトに当てたら球の動きが止まることを確認
14. エディタ上中央の「▶」をクリック

▷結果テキスト制御

スクリプトの記述例です。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Result : MonoBehaviour
{
    // Unity側で編集可能なゲームオブジェクト型の変数を定義
    public GameObject uiText;

    // Start is called before the first frame update
    void Start()
    {
        
    }

    // Update is called once per frame
    void Update()
    {
        
    }

    // オブジェクトと衝突した時に呼ばれる関数を定義
    void OnCollisionEnter(Collision collision)
    {
        // UIテキストを有効化
        uiText.SetActive(true);
        // 衝突オブジェクトが物理影響を受けないように設定
        collision.gameObject.GetComponent<Rigidbody>().isKinematic = true;
    }
}

▷銀結果作成

銅結果UIを複製し、表示文字を「Silver!」、文字色を銀色に設定します。

1. ヒエラルキーの「Canvas>TextCopper」をクリック
2. CTRLキーを押しながらDキーを押す
3. F2キーを押して「TextSilver」と入力し、ENTERキーを押す
4. インスペクターの「TextMeshPro>TextInput」下にあるテキスト入力に「Silver!」と入力
5. インスペクターの「TextMeshPro>Vertex Color」右にあるカラーバーをクリック、色ダイアログの16進数に「C0C0C0」と入力
6. 色ダイアログの右上にある「×」をクリック
7. CTRLキーを押しながらSキーを押す

▷銀結果制御

銀のマトに結果テキスト表示スクリプトを割り当て、銀結果UIを表示対象に設定します。

1. プロジェクトの「Assets>Result」をヒエラルキーの「Silver」にドラッグ＆ドロップ
2. ヒエラルキーの「Silver」をクリック
3. ヒエラルキーの「Canvas>TextSilver」をインスペクターの「Result>Ui Text」にドラッグ＆ドロップ
4. CTRLキーを押しながらSキーを押す
5. エディタ上中央の「▶」をクリック
6. 球を銀のマトに当てたら「Silver!」と表示されることを確認
7. 球を銀のマトに当てたら球の動きが止まることを確認
8. エディタ上中央の「▶」をクリック

▷金結果作成

銀結果UIを複製し、表示文字を「Gold!」、文字色を金色に設定します。

1. ヒエラルキーの「Canvas>TextSilver」をクリック
2. CTRLキーを押しながらDキーを押す
3. F2キーを押して「TextGold」と入力し、ENTERキーを押す
4. インスペクターの「TextMeshPro>TextInput」下にあるテキスト入力に「Gold!」と入力
5. インスペクターの「TextMeshPro>Vertex Color」右にあるカラーバーをクリック、色ダイアログの16進数に「FFD700」と入力
6. 色ダイアログの右上にある「×」をクリック
7. CTRLキーを押しながらSキーを押す

▷金結果制御

金のマトに結果テキスト表示スクリプトを割り当て、金結果UIを表示対象に設定します。

1. プロジェクトの「Assets>Result」をヒエラルキーの「Gold」にドラッグ＆ドロップ
2. ヒエラルキーの「Gold」をクリック
3. ヒエラルキーの「Canvas>TextGold」をインスペクターの「Result>Ui Text」にドラッグ＆ドロップ
4. CTRLキーを押しながらSキーを押す
5. エディタ上中央の「▶」をクリック
6. 球を金のマトに当てたら「Gold!」と表示されることを確認
7. 球を金のマトに当てたら球の動きが止まることを確認
8. エディタ上中央の「▶」をクリック

●リスタートボタン作成

▷リスタートボタン作成

UIボタンを「幅80、高さ40、左上寄せ」で作成、ボタンテキストを「Play」に設定します。

1. ヒエラルキー左上の「＋」をクリックし、「UI＞ボタン – TextMeshPro」をクリック
2. 「Restart」と入力し、ENTERキーを押す
3. インスペクターの「Rect Transform>アンカープリセット」をクリックし、SHIFTキーとAltキーを押しながら「top-left」をダブルクリック
4. インスペクターの「Rect Transform>幅」を(80)に設定
5. インスペクターの「Rect Transform>高さ」を(40)に設定
6. ヒエラルキーの「Canvas>Restart」左にある「▶」をクリック
7. ヒエラルキーの「Canvas>Restart>Text (TMP)」をクリック
8. インスペクターの「TextMeshPro>TextInput」下にあるテキスト入力に「Play」と入力
9. CTRLキーを押しながらSキーを押す

▷リスタート制御準備

自分シーンを再読み込みする機能を持ったスクリプトを作成し、UIボタンに割り当てます。

1. プロジェクトの「Assets」を右クリックし、「作成＞C# スクリプト」をクリック
2. 「Restart」と入力し、ENTERキーを押す
3. プロジェクトの「Assets>Restart」をヒエラルキーの「Canvas>Restart」にドラッグ＆ドロップ
4. CTRLキーを押しながらSキーを押す

▷リスタート制御

自分シーンを再読み込みする機能を持ったスクリプトを作成し、UIボタンに割り当てます。

1. プロジェクトの「Assets>Restart」をダブルクリック
2. 名前空間の宣言に「SceneManagement」の宣言を追加
3. ボタンから呼び出す関数を定義
4. 「ボタンから呼び出す関数」に以下の処理を記述
5. ・現在のシーン名を取得
6. ・現在のシーン名を読み込む
7. Unityエディタにフォーカスを移す
8. ヒエラルキーの「Canvas>Restart」をクリック
9. インスペクターの「Button>クリック時 ()」右下にある「＋」をクリック
10. インスペクターの「Button>クリック時 ()」に追加された枠の左下にヒエラルキーの「Canvas>Restart」をドラッグ＆ドロップ
11. インスペクターの「Button>クリック時 ()」に追加された枠の右上にあるドロップダウンをクリックし、「Restart>Run ()」をクリック
12. CTRLキーを押しながらSキーを押す
13. エディタ上中央の「▶」をクリック
14. Playボタンをクリックするとやり直せることを確認
15. エディタ上中央の「▶」をクリック

▷リスタート制御

スクリプトの記述例です。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
// 名前空間「SceneManagement」の宣言
using UnityEngine.SceneManagement;

public class Restart : MonoBehaviour
{
    // Start is called before the first frame update
    void Start()
    {
        
    }

    // Update is called once per frame
    void Update()
    {
        
    }

    // ボタンから呼び出す関数を定義
    public void Run()
    {
        // 現在のシーン名を取得
        string sceneName = SceneManager.GetActiveScene().name;
        // 現在のシーン名を読み込む
        SceneManager.LoadScene(sceneName);
    }
}

完成！