Godot Engine 入門 パート1

そろそろGodotを触ってみたくなってきましたよね？？
そこで今回はチュートリアルをやりましょう

先に[リファレンス実装](https://github.com/tomo-Gomibako/godot-roll-a-ball)を置いておきます
かなり詳しくスクショを撮ったつもりですが、行き届かない部分があればこのリポジトリを参照してください

題材は、Unityチュートリアルでお馴染みの玉転がしです

<details><summary>玉転がしとは？</summary>
Unityで最も有名なチュートリアルのひとつ
[![玉転がしの概要動画](http://img.youtube.com/vi/RFlh8pTf4DU/0.jpg)](http://www.youtube.com/watch?v=RFlh8pTf4DU)
ユーザーの入力に応じてオブジェクトを動かしたり、オブジェクトとの衝突判定を習得することができる
</details>

# Godot Engine のインストール

1. 公式の [ダウンロードページ](https://godotengine.org/download) から該当のエディタをダウンロードする
  - 基本的に「STANDARD VERSION」を選ぶ
  - C#を使いたい場合は「MONO VERSION」を選べばよさそう (試してはいない)

2. ダウンロードされたzipを解凍して、出てきたGodotをアプリケーションフォルダに移動する
  - WindowsはProgram Filesに？

3. 移動したGodotをダブルクリックして起動する
  <img width="700" alt="スクリーンショット 2019-10-22 17.51.47.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/6648437f-2309-f742-23f6-b4fd2fb743f2.png">
  この画面が出たら何も触らずに「表示言語の設定」へ

## 表示言語の設定
下図の赤丸の部分をクリックして、ドロップダウンメニューから使いたい言語を選んでください
<img width="700" alt="スクリーンショット 2019-10-22 17.51.47のコピー.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/ad54492b-da7d-bcba-d990-e5753a0ec4f4.png">
今回このチュートリアルでは日本語を選択します
<img width="700" alt="スクリーンショット 2019-10-22 17.52.02.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/69195d1f-3af6-7298-ca4f-d19546284cfb.png">
英語以外を選択した場合はエディタの再起動を求められるので「Restart Now」をクリック

<img width="700" alt="スクリーンショット 2019-10-22 17.52.08.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/4c5cd0dd-e103-c04e-d5d1-414014a8bb01.png">
日本語化完了✨
<img width="700" alt="スクリーンショット 2019-10-22 17.52.17.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/a4488f13-1c3c-5047-1183-fa1bff04c19f.png">


# プロジェクトの作成
下図の「新規プロジェクト」をクリック
<img width="700" alt="スクリーンショット 2019-10-22 17.52.28のコピー.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/1e591cf4-5983-7cd5-8515-c3c668bc435c.png">
今回はプロジェクト名を「Roll a Ball」とし、```~/Godot Projects/Roll-a-Ball```というディレクトリを指定することにします

> Godotでは、 (Unityなどとは違い) 指定したディレクトリに直接プロジェクトの内容が展開されるので、プロジェクトパスには空のディレクトリを指定する必要があります
> また、同じ理由で、指定するディレクトリの名前はどんなプロジェクトかわかるようなものをつけておくのが無難です

プロジェクトを作成するには「作成して編集」をクリックします
<img width="700" alt="スクリーンショット 2019-10-22 17.54.27のコピー.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/fdf87bb2-6a80-4dc7-318d-a05af2f78230.png">

# 玉転がし
この画面になっていると思います
<img width="1000" alt="スクリーンショット 2019-10-22 17.55.16.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/a6f2d4bb-a22d-2cd4-1dda-7fdc69cec44d.png">
「3Dシーン」を選びます
<img width="1000" alt="スクリーンショット 2019-10-22 17.55.16のコピー.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/23576514-c529-34c0-b8fe-3452415b12e3.png">
ルートノードに「Spacial」ノードが追加されました
<img width="1000" alt="スクリーンショット 2019-10-22 17.55.18.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/54fdc7e9-e9b9-7944-97ae-895cf8863062.png">

## フィールド作成
玉転がしをするための床と壁を作ります

### 床
先程の「Spacial」ノードで右クリックして「子ノードを追加」を選択します
<img width="1000" alt="スクリーンショット 2019-10-22 17.55.27.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/55449b5f-b42f-2662-bc94-376c7abff6ac.png">
```Spacial > CollisionObject > PhysicsBody```にある「RigidBody」を選択し、「作成」ボタンをクリックします

> 検索窓に「rigid」とタイプしてReturnキーを押すだけでも同じ操作ができます

<img width="1000" alt="スクリーンショット 2019-10-22 17.58.44.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/ec327c8d-2dee-6127-dbf6-912efd6b2c19.png">
追加された「RigidBody」ノードに対しても同様に「子ノードを追加」を選び、
<img width="1000" alt="スクリーンショット 2019-10-22 17.58.54.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/125d127d-5473-9f43-49e5-45dc2f9b25f2.png">
次は```Spacial > CollisionObject```の「CollisionShape」を選びます
<img width="1000" alt="スクリーンショット 2019-10-22 17.59.02.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/328acffc-9287-ffa3-5e6e-300ee502b113.png">
追加された「CollisionShape」ノードを選択し、右側のインスペクタで「Shape」をクリックします
<img width="1000" alt="スクリーンショット 2019-10-22 17.59.13のコピー.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/191f6ec3-9ac7-26d5-2990-2bdea69fe939.png">
「新規BoxShape」を選ぶ
<img width="1000" alt="スクリーンショット 2019-10-22 17.59.17.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/6e37f033-0fc1-06e4-3d6d-dafb330890b4.png">
「CollisionShape」ノードに対してさらに子ノードを追加
<img width="1000" alt="スクリーンショット 2019-10-22 17.59.35.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/538ee543-2d22-1dd9-71c9-6943cf5beb23.png">
```Spacial > VisualInstance > CSGShape > CSGPrimitive```の「CSGBox」を選ぶ
<img width="1000" alt="スクリーンショット 2019-10-22 17.59.41.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/b514efe2-2c26-8321-dc80-608f4a4d94ec.png">
ようやく四角いオブジェクトが出ました
「CollisionShape」ノードを選んで、インスペクタのTransformを変更します
<img width="1000" alt="スクリーンショット 2019-10-22 18.00.11のコピー.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/6daa2031-dcc2-9300-fdae-611b486a2856.png">
床らしいScaleを指定します
Translateは別の場所で指定するので0のままにしておいてください
<img width="1000" alt="スクリーンショット 2019-10-22 18.00.52.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/63010f1d-44dc-ff2b-6d75-43ba40a53892.png">
このRigidBodyが床であることをわかりやすくするために、名前を変更します
<img width="1000" alt="スクリーンショット 2019-10-22 18.01.25.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/7cb48c52-d479-07cd-2a7a-bd89a7d2226a.png">
「Floor」という名前にしました
<img width="1000" alt="スクリーンショット 2019-10-22 18.01.34.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147904/860aed63-0142-00a1-e6f1-e568c19cedf2.png">

[パート2](https://qiita.com/tomon9086/items/b893cc1b54cbc07ee583)に続きます…