【Unity2D】Flappy Bird を作るチュートリアル (1/3)

# 概要
この記事は、Unity初心者向けに、Flappy Bird (みたいなゲーム）を作りながら操作方法を学べるチュートリアルです。
![042.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/7c57ed8c-7914-9ace-5b84-158d78eb395f.gif)
こんなゲームを作ります。

ページ作成の都合でこの記事は３ページに分かれていて、ここは最初のページとなります。

# ページのリンク

* Flappy Bird を作るチュートリアル (1/3) ←今のページ
* [Flappy Bird を作るチュートリアル (2/3)](https://qiita.com/2dgames_jp/items/95f598dd9044c258df88)
* [Flappy Bird を作るチュートリアル (3/3)](https://qiita.com/2dgames_jp/items/77d6a09e65b37ea09f58)

# やることリスト
今回のチュートリアルでは以下のことを実装していきます。

1. [ ] プロジェクトの作成　←①
2. [ ] プレイヤーの作成　←①
3. [ ] ブロック（障害物）の作成
4. [ ] ブロック管理の作成
5. [ ] スコアの実装
6. [ ] ゲームオーバーの実装
7. [ ] リトライの実装

第一回（このページ）では、①の部分まで進めていきます。

# プロジェクト作成と環境設定
Unity Hub を起動して、プロジェクトを新規作成します。
<img width="861" alt="001.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/63ec72d5-c038-05c5-994e-f92be2ee802e.png">

1. テンプレートは「2D」を選択
2. プロジェクト名は「TestFlappyBird」
3. 作成ボタンをクリックする

※保存先は任意の場所。デスクトップなどにしておくとフォルダへのアクセスがしやすいです。

## レイアウトの設定
今回の説明で使用するレイアウトは「2 by 3」とします。
<img width="1277" alt="002.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/bedd9c57-c668-2ee4-9c56-cad551780cc0.png">
![003.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/9375e364-8a01-f89c-51c1-b19316717ec2.gif)
Projectビューのアイコンは最小化しておくと見やすくて良いです。

## 素材のダウンロード
今回のゲームで使用する素材は以下の場所にアップロードしています。
http://syun777.sakura.ne.jp/tmp/Unity/FlappyBird/images.zip
> ■フォルダ構成
　images
  　　+-- 5box.png: 障害物
  　　+-- nasu.png: ゲーム管理の仮画像
 　　+-- player.png: プレイヤー
  　　+-- xbox.png: 障害物管理の仮画像

# プレイヤーの作成
まずはプレイヤーを作成します。

## スプライトの設定
素材画像の `player.png`を Projectビューの Assets フォルダにドラッグ＆ドロップします。
<img width="334" alt="スクリーンショット_2019_11_19_10_19.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/176a78d1-f0e3-d639-e992-01af6216f634.png">
すると、Assetsフォルダ内に "player" というスプライトリソースが作られます。
<img width="526" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal__と_「【Unity2D】Flappy_Bird_を作るチュートリアル」を編集_-_Qiita.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/10347f84-c2da-141f-231b-c93fa7222dad.png">
`player` を選択して、Inspectorビューから Sprite Mode を `Multiple` に変更して、 `Sprite Editor` ボタンをクリックします。
<img width="419" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/eda88f1d-69d6-c715-5779-d3aaa0dac33c.png">
この際にこのようなダイアログが表示されますが、これは「 Sprite Mode を変更したのに Apply(適用する)をしていませんがよろしいですか？」という確認メッセージです。特に問題ないので、Apply をクリックして適用します。

Sprite Editor が表示されるので、`Slice` のドロップダウンをクリックして、設定はそのままで `Slice` ボタンをクリックします。
<img width="427" alt="UnityEditorInternal_SpriteEditorMenu_と_Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/9428ebb7-a526-f639-6d23-a46c31b0729d.png">
`Slice` ボタンを押しても見た目に変化がないので、何も変わっていないように見えますが、下にある画像をクリックすると良い感じにスライスされているのが確認できます。
![010.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/90199631-c90c-cbec-5d4a-0f10632ecb91.gif)
`Sprite Editor` を閉じると、以下のようにメッセージが表示されますが、これも「 `Apply` ボタンを押していないけれど大丈夫？」という確認のメッセージなので、`Apply` を押して適用します。
<img width="417" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/0294e92e-32e9-6c21-8422-0876824d14e4.png">
ちなみに Projectビューの Assets フォルダから player スプライトを選択してもスライスした情報を確認できます。
![011.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/252e3e24-46ab-92ef-b742-342facc9cdfa.gif)
`player_0` と `player_1` というスプライト名でスライスされたということがわかります。
なお、Sprite Mode の `Multiple` という設定は、このように1つの画像から複数のスプライトを作る、というものとなります。

## プレイヤーオブジェクトを作成する
早速このプレイヤーをゲーム内に配置してみます。
<img width="955" alt="スクリーンショット_2019_11_19_10_49.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/0e6b457e-742d-e75a-23ae-56ff5a914c51.png">
`player_0` を Scene ビューにドラッグ＆ドロップします。
<img width="167" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/ed1b6f19-3578-84ac-d43f-43836f67a74c.png">
すると Hierarchy ビューに `player_0` というゲームオブジェクトが作られます。この `player_0` をクリックして選択し、Inspectorビューから
`Player' という名称に変更しておきます。
<img width="252" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/5cd25d76-e2d4-0c4f-13ba-4f9316b52895.png">

## コンポーネント 「Rigidbody 2D」 を追加する
Player にコンポーネント「Rigidbody 2D」を追加します。「Rigidbody 2D」とは、オブジェクトの物理的な挙動（移動や落下）を制御するためのものです。これをゲームオブジェクトに登録することで、プレイヤーが操作したり、落下したりすることができます。
<img width="294" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal__と_「【Unity2D】Flappy_Bird_を作るチュートリアル」を編集_-_Qiita.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/dd9948d0-9efd-f021-22bd-9dbee177505a.png">
ちなみにゲームオブジェクトには初期状態で「Transform」というコンポーネントが登録されており、これは「座標」「回転値」「拡大縮小値」を保持しています。
画像が表示できているのは「Sprite Renderer」が登録されているためです。
<img width="158" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/c848e145-826a-e333-d630-cebc33a0fe40.png">
試しに「Sprite Renderer」の隣にあるチェックボックスをクリックするとスプライトの描画が無効になって何も表示されなくなります。
ゲームオブジェクトとコンポーネントの関係のイメージとしては以下の通りです。
<img width="629" alt="名称未設定.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/280a68c8-7f0f-b6c7-f52f-a4a11ad4eb51.png">
ゲームオブジェクトが複数のコンポーネント（Transform / Sprite Renderer / Rigidbody 2D / Collider 2D）を持つことになります。

ゲームオブジェクトとコンポーネントの関係を説明したところで、物理挙動の機能をもつ「Rigidbody 2D」を登録します。
`Player` ゲームオブジェクトを選択した状態で、Inspectorビューから「Add Component」をクリックして、 `Rigidbody 2D` を選ぶと登録できます。
![012.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/a341b1ed-abb3-ea4f-fcc7-38a70bef93e8.gif)
登録できたら、Unityエディタの上中央にある「▶︎（再生ボタン）」をクリックして動作を確認します。
![013.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/163edd35-6dca-65a0-be63-0c27e2dc0fbe.gif)
実行すると Playerオブジェクトは重力で落下していきます。その動きを確認したら、もう一度「▶︎（再生ボタン）」をクリックして、再生を止めた状態にしておきます。
<img width="112" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/1b7c60a0-7fa4-b718-4639-6f38b10b5ecd.png">
（凹んだ状態を解除しておく）

## スクリプトを追加して動きを作る
Playerに「スクリプト」というコンポーネントを追加して動きを作ります。
![014.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/789b82d7-102f-fa40-3aa4-86dea1444870.gif)

1. Playerオブジェクトを選択
2. Inspectorビューから「Add Component」ボタンをクリック
3. scriptで検索して「New Script」を選ぶ
4. スクリプト名を「Player」にして「Create And Add」をクリック

<img width="267" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/b95f26d8-125d-a160-e938-e70579cc716d.png">
これにより「Player」というC#スクリプトがプロジェクトに追加されます。

## スクリプトの記述
`Player` スクリプトをダブルクリックしてスクリプトを開き、以下のコードを入力します。

```Cs:Player.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

// ■プレイヤー
public class Player : MonoBehaviour {
  [SerializeField]
  float JUMP_VELOCITY = 1000; // ①ジャンプ力の定義

  Rigidbody2D _rigidbody; // ②物理挙動コンポーネント保持用

  // 開始処理
  void Start() {
    // ③物理挙動コンポーネントを取得
    _rigidbody = GetComponent<Rigidbody2D>();
  }

  // 更新
  void Update() {
    if (Input.GetKeyDown(KeyCode.Space)) {
      // ④Spaceキーを押したのでジャンプ処理
      _rigidbody.velocity = Vector2.zero; // 落下速度を一度リセットする
      _rigidbody.AddForce(new Vector2(0, JUMP_VELOCITY)); // 上方向に力を加える
    }
  }
}
```

記述する場所には番号をつけています。
①はジャンプ力の定義です。ひとまず力の大きさは `1000` としました。`[SerializeField]` をつけることで、Unityエディタからも値の変更が可能となります。

②は物理挙動コンポーネントである `Rigidbody 2D` を保持する変数の定義です。コンポーネントを取得する関数は処理が重いので、あらかじめ保持するようにしておきます。

③は `Rigidbody 2D` を取得して `_rigidbody` 変数に格納しています。 `Start()` はゲームオブジェクトの最初の Update() が呼び出される前に呼び出される関数です。
詳細は UnityのAPIドキュメントに記載されています。
https://docs.unity3d.com/jp/460/ScriptReference/MonoBehaviour.Start.html

`Start()` はこのような「一番最初に一度だけ呼び出される」処理をするのに便利な関数となります。

`Update()` 内に記述した④でキー入力を受け取ります。 `Input.GetKeyDown(KeyCode.Space)` を使うと、キーボードのSpaceキーを押した瞬間かどうかを判定できます。そして Spaceキーを押したら、`_rigidbody.AddForce()` で上方向に力を加えます。力を加える前に `_rigidbody.velocity` に速度0 の値を代入することで、落下速度を無視したジャンプ力を加えています。
現実世界で考えると、落下速度の力を無視した上昇はできないのですが、操作感はこの方法が良くなります。ゲームでは時々、このような「ウソ物理挙動」がゲームをより面白くすることがあります。

スクリプトが入力できたら▶︎（再生ボタン）を押して実行してみましょう。
<img width="110" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/c21b47ec-7f6b-ab28-a4ef-5c0b0917f511.png">
![015.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/d835bcfe-421b-6812-9266-0030dec246c4.gif)
`Space` キーでプレイヤーが上昇しますが、力が大きすぎて画面外へ飛び出してしまいます。

## ジャンプ力の調整
ここで先ほどスクリプトで指定した `[SerializeField]` が役に立ちます。

```Cs:Player.cs
  [SerializeField]
  float JUMP_VELOCITY = 1000; // ジャンプ力の定義
```

の部分です。
スクリプトに指定した値を直接書き換えても良いのですが、 `[SerializeField]` を指定することで、Unityエディタから修正ができます。

Hierarchyビューから「Player」オブジェクトを選択して、
<img width="201" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/21ac2d43-5d93-0adc-209d-301653a93163.png">
Inspectorビューの Player(Script) の `JUMP_VELOCITY` を 400 に変更します。
<img width="273" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/8188d447-31b5-0fd6-b143-cd849fe5e675.png">
そうしたら▶︎（再生ボタン）をクリックして実行してみます。
![016.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/3d0ca9a2-82ff-5d81-e34c-6828c68de645.gif)
良い感じのジャンプになりました！
## 重力の調整
個人的に少しふんわりした挙動が気になったので、もう少し強い重力をかけるようにします。
PlayerオブジェクトのInspectorから、`Rigidbody 2D` > `Gravity Scale` の値を `1` から `2` に変更します。
<img width="267" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/b790cf58-0662-8ee2-a68f-36d8851340ec.png">
`Gravity Scale` は重力加速度の強さです。これを小さくすると重力が小さくなり、大きくするほど大きな重力がかかるようになります。
![017.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/1e3f70d8-9a69-2dd5-c30e-f3ab9aadf83c.gif)
重力を2倍にすることで、鋭い落下になりました。

## 画面外に出ないようにする
プレイヤーを画面外に出ないようにします。方法としては、画面の端の位置を計算して、そこからはみ出ていたら押し戻す、という処理を行います。
<img width="603" alt="名称未設定.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/d2767e73-abf6-d3cc-ae13-5d9184b131b9.png">
画面の端の取得には `Camera.main.ViewportToWorldPoint()` という関数を使用します。この関数で画面に表示されている位置を取得できます。この関数の座標系は以下の通りです。
<img width="632" alt="名称未設定.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/8baa67ed-2aff-3f52-565e-54c02a3fcc10.png">
左下が(0, 0)となり、右上が(1, 1)です。これを使って画面の上の部分と下の部分を取得するコードの記述例は以下の通りです。

```cs
// 画面上を取得する
float GetTop() {
  // 画面の右上のワールド座標を取得する
  Vector2 max = Camera.main.ViewportToWorldPoint(Vector2.one);
  return max.y
}

// 画面下を取得する
float GetBottom() {
  // 画面の左下のワールド座標を取得する
  Vector2 min = Camera.main.ViewportToWorldPoint(Vector2.zero);
  return min.y;
}
```

`Vector2.zero` は (0, 0)を、`Vector2.one` は (1, 1) を表します。
では、`Player.cs` を開いて、以下のようにコードを修正します。
<img width="315" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/20331637-998d-e5f0-9b8e-00bfaa95f188.png">

```Cs:Player.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

// ■プレイヤー
public class Player : MonoBehaviour {
  [SerializeField]
  float JUMP_VELOCITY = 1000; // ジャンプ力の定義

  Rigidbody2D _rigidbody; // 物理挙動コンポーネント保持用

  // 開始処理
  void Start() {
    // 物理挙動コンポーネントを取得
    _rigidbody = GetComponent<Rigidbody2D>();
  }

  // 更新
  void Update() {
    if (Input.GetKeyDown(KeyCode.Space)) {
      // Spaceキーを押したのでジャンプ処理
      _rigidbody.velocity = Vector2.zero; // 落下速度を一度リセットする
      _rigidbody.AddForce(new Vector2(0, JUMP_VELOCITY)); // 上方向に力を加える
    }
  }

  // 固定フレーム更新
  private void FixedUpdate() {
    // ①座標を取得
    Vector3 position = transform.position;
    // ②画面外に出ないようにする
    float y = transform.position.y;
    float vx = _rigidbody.velocity.x;
    if (y > GetTop()) {
      _rigidbody.velocity = Vector2.zero; // 速度を一度リセットする
      position.y = GetTop(); // ③押し戻しする
    }
    if (y < GetBottom()) {
      // ④下に落ちたらオートジャンプ
      _rigidbody.velocity = Vector2.zero; // 落下速度を一度リセットする
      _rigidbody.AddForce(new Vector2(0, JUMP_VELOCITY));
      position.y = GetBottom(); // 押し戻しする
    }

    // ⑤座標を反映する
    transform.position = position;
  }

  // 画面上を取得する
  float GetTop() {
    // 画面の右上のワールド座標を取得する
    Vector2 max = Camera.main.ViewportToWorldPoint(Vector2.one);
    return max.y;
  }

  // 画面下を取得する
  float GetBottom() {
    // 画面の左下のワールド座標を取得する
    Vector2 min = Camera.main.ViewportToWorldPoint(Vector2.zero);
    return min.y;
  }
}
```

追加した部分は、`FixedUpdate()` と `GetTop()` / `GetBottom()` 関数です。
`FixedUpdate()` 一定間隔で呼び出されることが保証される `Update()` です。`Update()` は呼び出される間隔が不定なので、物理挙動を行う場合は `FixedUpdate()` 内に記述すると都合が良いためとなります。

では `FixedUpdate()` をみていきます。まずは①です。

```Cs:Player.cs
    // ①座標を取得
    Vector3 position = transform.position;
    float y = transform.position.y;
```

ここでは Playerオブジェクトの位置を取得するために、transform コンポーネントから Y軸の値を取得しています (`transform.position.y`) 。Playerオブジェクトは上下のみの移動なので、Y軸の値だけで判定できます。

続いて②・③の部分です。

```Cs:Player.cs
    // ②画面外に出ないようにする
    if (y > GetTop()) {
      _rigidbody.velocity = Vector2.zero; // 速度を一度リセットする
      position.y = GetTop(); // ③押し戻しする
    }
```

画面上からはみ出してしまったら、上昇速度をリセットして（ゼロにする）、はみ出ない位置まで押し戻します。
![push.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/0fa927a8-68a2-99b1-289c-9444a525e4ad.png)
また速度をゼロにすることで、移動によるめり込みを防ぐようにしています。

④は画面下の判定です。

```cs:Player.cs
    if (y < GetBottom()) {
      // ④下に落ちたらオートジャンプ
      _rigidbody.velocity = Vector2.zero; // 落下速度を一度リセットする
      _rigidbody.AddForce(new Vector2(0, JUMP_VELOCITY));
      position.y = GetBottom(); // 押し戻しする
    }
```

押し返し処理としては同じですが、自動でジャンプ処理を行うようにしました。

最後に⑤で押し返した位置を `transform` に反映させます。

```Cs:Player.cs
    // ⑤座標を反映する
    transform.position = position;
```

では実行して動きを確認してみます。
![018.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/905e8d5e-a3b7-cee0-df67-f98b9032eaf0.gif)
画面上からはみ出なくなり、画面下では自動でジャンプするようになりました。

## ジャンプアニメーションの追加
ジャンプ上昇中はキャラクター画像を切り替える簡単なアニメーションを実装します。
Unityでアニメーションを作る場合、Animatorを使うのが一般的ですが、少し複雑なので、ここではスクリプトで制御する方法で実装してみます。
Player.cs を開いて、以下のように修正します。

```cs;Player.cs
// ■プレイヤー
public class Player : MonoBehaviour {
  // ①スプライト番号定義
  const int SPR_FALL = 0; // 落下中
  const int SPR_JUMP = 1; // ジャンプ中

  [SerializeField]
  float JUMP_VELOCITY = 1000; // ジャンプ力の定義
  public Sprite[] SPR_LIST; // ②アニメーション用スプライトの保持

  Rigidbody2D _rigidbody; // 物理挙動コンポーネント保持用

  // 開始処理
  ・
  ・
  ・
```

①のところで、スプライト番号に対応する画像定数 (`SPR_FALLL` / `SPR_JUMP`) を定義しています。
②で スプライトの配列 `SPR_LIST` を定義して、スプライト番号に対応するスプライトを格納します。

記述できたら、Unityエディタに戻って、Playerオブジェクトの Scriptコンポーネントに注目します。
<img width="279" alt="Unity_2018_4_12f1_Personal_-_SampleScene_unity_-_TestFlappyBird_-_PC__Mac___Linux_Standalone__Personal___Metal_.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/639a4502-1fbb-e1e2-3160-8d4c1ce6ef08.png">
`JUMP_VELOCITY` の下に、`SPR_LIST` という項目が増えているのが確認できます。ここの `Size` を `2` に変更して、スプライト `player_0` / `player_1` を割り当てます。
![019.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/ee78e1e3-d86e-e193-8f39-0125755e3207.gif)
これにより、`SPR_LIST[0]` には "player_0"、`SPR_LIST[1]` に "player_1" が割り当てられたことになります。
<img width="360" alt="名称未設定.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/c4012b46-a9a9-41f4-878f-ef157b927f63.png">
これを Playerオブジェクトの状態によって切り替えるようにします。
Player.cs を開いて、以下のように修正します。

```Cs:Player.cs
// ■プレイヤー
public class Player : MonoBehaviour {
  // スプライト番号定義
  const int SPR_FALL = 0; // 落下中
  const int SPR_JUMP = 1; // ジャンプ中

  [SerializeField]
  float JUMP_VELOCITY = 1000; // ジャンプ力の定義
  public Sprite[] SPR_LIST; // アニメーション用スプライトの保持

  Rigidbody2D _rigidbody; // 物理挙動コンポーネント保持用
  SpriteRenderer _renderer; // ①スプライト描画

  // 開始処理
  void Start() {
    // 物理挙動コンポーネントを取得
    _rigidbody = GetComponent<Rigidbody2D>();
    // ②スプライト描画コンポーネントを取得
    _renderer = GetComponent<SpriteRenderer>();
  }

  // 更新
  void Update() {
    if (Input.GetKeyDown(KeyCode.Space)) {
      // Spaceキーを押したのでジャンプ処理
      _rigidbody.velocity = Vector2.zero; // 落下速度を一度リセットする
      _rigidbody.AddForce(new Vector2(0, JUMP_VELOCITY)); // 上方向に力を加える
    }

    // ③プレイヤーの状態でスプライトを切り替える
    if (_rigidbody.velocity.y < 0) {
      // 落下中
      _renderer.sprite = SPR_LIST[SPR_FALL];
    } else {
      // 上昇中
      _renderer.sprite = SPR_LIST[SPR_JUMP];
    }
  }
  ・
  ・
  ・
```

①でスプライト描画コンポーネントである `SpriteRenderer` を格納する変数を定義しています。

```Cs:Player.cs
  SpriteRenderer _renderer; // ①スプライト描画
```

スプライト描画コンポーネントを取得するために、② (Start関数) で取得処理を行っています。

```cs:Player.cs
  // 開始処理
  void Start() {
    // 物理挙動コンポーネントを取得
    _rigidbody = GetComponent<Rigidbody2D>();
    // ②スプライト描画コンポーネントを取得
    _renderer = GetComponent<SpriteRenderer>();
  }
```

そして③（Update関数）で落下方向によってスプライトの切り替えを行っています。下方向の移動(yがマイナス)であれば落下とし、上方向の移動であればジャンプ中、という判定としています。

```Cs:Player.cs
  // 更新
  void Update() {
    if (Input.GetKeyDown(KeyCode.Space)) {
      // Spaceキーを押したのでジャンプ処理
      _rigidbody.velocity = Vector2.zero; // 落下速度を一度リセットする
      _rigidbody.AddForce(new Vector2(0, JUMP_VELOCITY)); // 上方向に力を加える
    }

    // ③プレイヤーの状態でスプライトを切り替える
    if (_rigidbody.velocity.y < 0) {
      // 落下中
      _renderer.sprite = SPR_LIST[SPR_FALL];
    } else {
      // 上昇中
      _renderer.sprite = SPR_LIST[SPR_JUMP];
    }
  }
```

では実行して、ジャンプ中と落下中でスプライトが切り替わることを確認します。
![020.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43772/a7b8c3dc-d04c-c7bc-c436-e527a57e6063.gif)

# 次回
次のページでは障害物となるブロック、それを生成するブロック管理を作成します。

→[Flappy Bird を作るチュートリアル (2/3)](https://qiita.com/2dgames_jp/items/95f598dd9044c258df88)