【Godot 4.0】スマホ３Dゲームを作るための勉強　その１３　キャラクターの色を設定します

　ゲームエンジンGodot4.0で3Dスマホゲームを作りたいと思いますが、その前にお勉強しています。
　2023/3/1もstable版がリリースされました。
 [Godot_v4.0-stable_win64.exe.zip](https://godotengine.org/download/windows/)を使用しています。

# 目的
　敵の攻撃EnemyBulletも人にします。
　色を変更します。

# ベースプロジェクト
下記で作成したプロジェクトをベースに機能追加をします。
　【Godot 4.0】スマホ３Dゲームを作るための勉強　その１２　キャラクターデザインとアニメーション
　https://qiita.com/FootInGlow/items/0bada2d1485c4a667a82
　
　github(Godotのプロジェクトマネージャーからインポートして利用できます）
　https://github.com/footinglow/Godot4/tree/main/02_study/S12_CharacterDesignAnimation_001

# Designファイルを別ディレクトリにまとめます。
　Designフォルダを作成して、キャラクターデザイン関係のファイルを移動しましょう。

## Designフォルダを作成する
　ファイルシステム内の「res://」を右クリックして新規からフォルダを選択します。
　![スクリーンショット (45).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/fd5172ae-8668-a858-859c-163189fc87c0.png)
「Design」にします。
![スクリーンショット (46).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/cfb09ddb-b6bd-e5e1-4b6e-5194098a38c4.png)
「Design」フォルダが作成されました。
![design_my_soldier.tscn - S13_CharacterDesignAnimation_002 - Godot Engine 2023_03_05 23_16_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/68b80c2d-1ec7-85c3-da2d-13f8a5050313.png)

## デザイン関係のファイルを移動します。
　「design_my_soldier.tscn」と「design_my_soldier.gd」の2つのファイルをShiftキーを押下しながら選択します。Designフォルダにドラッグアンドドロップします。
![スクリーンショット (47).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/e0986454-5e9c-d3d2-3a35-ca1a33a4885f.png)
移動しました。
![C__Users_hathr_Videos_Captures [ main ↓0 ↑1 ] 2023_03_05 23_17_37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/fa5c2e19-c7cd-eb31-9469-111ae173d1a4.png)

# EnemyBullet用のデザインを作成します。
　EnemnyBullet用のデザインを作成します。
　Bulletの人の色違いを作成したいと思います。

## design_my_soldier.tscnを複製する
　「design_my_soldier.tscn」を複製します。

　ファイルシステム内の「design_my_soldier.tscn」を右クリックして「複製」を実行します。
![スクリーンショット (48).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/4f132f46-0a5a-d2a8-39f8-0ed0eb5c9770.png)
「design_enemy_soldier.tscn」にします。
![スクリーンショット (49).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/10c07285-1f6b-8b3d-1a03-cf25d2302787.png)
複製されました。
![design_my_soldier.tscn - S13_CharacterDesignAnimation_002 - Godot Engine 2023_03_05 23_25_22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/af3956c2-a7b3-323b-41e9-0738dbd85b23.png)

## design_my_soldier.tscnをEnemyBulletに設定する
　今複製した「design_my_soldier.tscn」を開きます。
　トップノード名を「DesignMySoldier」から「DesignEnemySoldier」に変更して保存します。

　次にEnemybullet.tscnを開きましょう
　ファイルシステム内の「design_my_soldier.tscn」をシーン内の「EnemyBullet」にドラッグアンドドロップします。
　![スクリーンショット (52).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/73e6cca4-ba08-578c-cd86-0d7438985f04.png)
　「DesignEnemySoldier」が追加されました。
![スクリーンショット (53).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/1912856c-7cf9-4648-cd81-d977f27739b3.png)

　大きすぎるので、１／５に縮小します。
　「DesignEnemySoldier」を選択して、インスペクタ内のNode3D/Tranform/Scale/xを0.2にします。サイズのｘ、ｙ、ｚはリンクされているので、ｙとｚも0.2になると思います。

　今まで使用していた、MeshInstance3Dは不要になりましたので削除します。
![(_) Enemybullet.tscn - S13_CharacterDesignAnimation_002 - Godot Engine 2023_03_05 23_38_31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/8447acec-3502-f365-d02a-24ddecc36deb.png)

　実行します。
![Screenshot 2023_03_05 23_41_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/1bf66c73-284d-3474-423e-5102c8a1343d.png)

# EnemyBullet(EnemySoldier)の色を変更する
　敵も味方も同じ色では判別しにくいので、敵側を赤にしましょう。

## 胴体の色を設定します。
　まず胴体に色をつけましょう。
　３Dモデルの表面の質感・色情報をMaterialといいます。また表面の色はAlbedoというパラメータで設定します。

　res://Design/design_enemy_soldier.tscnを開いて、Bodyを選択します。
　インスペクタ内のMeshInstance3D/Meshのカプセルのアイコンをクリックすると詳細設定が開きます。
　その中に「Material <空> 」とあるので、「新規StandardMaterial3D」を選択します。
![68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3639313035302f33376231626539652d663434632d613132322d666432652d3934356365346336663235382e706e67.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/3060218b-7b4a-862b-bf66-c2b0809fef8d.png)
　Materialに新規のMaterialが設定されました。
![68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3639313035302f65613662383032322d616261392d303064662d643963612d6164663938653935653065642e706e67.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/edaf652b-8df1-7f97-ae6e-9a61448be691.png)

　今追加した、Materialを表す球をクリックして詳細設定を開きます。
　表面の色は「Albedo」という項目で設定できるので、開きましょう。
![68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3639313035302f64366631356662622d343833662d663433302d643134632d3366383733656231643864382e706e67.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/9e629b54-aeea-f812-f461-61e8e1c0672a.png)

　Colorの右の白色の長方形をクリックするとカラーピッカーが表示されるので色を選択します。
![スクリーンショット (56).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/517dcfa8-c91f-865a-e30e-7347b5d8b93f.png)
　色を選択すると、インスペクタのMaterialの球の色に反映されます。
　ビューポートに表示されている人の胴体の色も変更しました。
![(_) design_my_soldier.tscn - S13_CharacterDesignAnimation_002 - Godot Engine 2023_03_06 0_11_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/0b920e69-a2fd-5522-471f-cf1fe6a19d3c.png)


## 胴体の設定を他のパーツにも反映する
　今設定した胴体の色を含むMaterial情報をファイルに出力して、他のパーツと共有しましょう。

　作業の続きなので、DesignEnemySoldierのBodyが選択された状態かと思います。
　インスペクタ内のMeshInstance3D/Meshのアイコン（カプセル型）をクリックして詳細設定を表示します。詳細設定の中のMaterialの横に球が表示されていると思います。
　球の右の「ｖ」のようなアイコンをクリックして「保存」を実行します。
![スクリーンショット (57).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/f7c4ed5c-0f3a-8a6d-6f5f-cdafcbd122ff.png)　

　「design_enemy_soldier.tres」という名前で保存します。
![design_enemy_soldier.tscn - S12_CharacterDesignAnimation_001 - Godot Engine 2023_03_06 0_14_24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/c6ea13ab-3b40-8c5a-7664-38c2d8269320.png)

　胴体以外のパーツのMaterialに「design_my_soldier.tres」を設定します。
　Headを選択して、MeshInstance3D/Meshのアイコン（球型）をクリックして詳細設定を表示します。
　詳細設定を表示した中に「Material <空>」があるので、その右の「v」アイコンをクリックして、「クイックロード」を実行します。
![スクリーンショット (59).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/5b7c07a3-a3f4-1872-fca1-a90b21f8a111.png)

先ほど保存した、「design_enemy_soldier.tres」を選択します。
![スクリーンショット (60).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/66b5e151-6d67-f750-5a4b-7ca652fd7740.png)
　頭に胴体と同じ色が設定されました。
![design_enemy_soldier.tscn - S12_CharacterDesignAnimation_001 - Godot Engine 2023_03_06 0_18_29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/17a6663c-e4f3-4da8-d5dc-89f580e9a4d9.png)
　残りのパーツも同じMaterialを設定します。
　「Shoulder_Right」の「Arm」を選択して、Materialをクイックロードしましょう。
　そうすると左右の手足すべてのMaterialが変更されました。
![(_) design_enemy_soldier.tscn - S12_CharacterDesignAnimation_001 - Godot Engine 2023_03_06 0_21_05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/b15fa548-68db-8c5a-93db-52127a2973d2.png)

:::note
　右腕からコピーペーストで左腕、右足、左足をつくったため、Materialを共有してもっているのかもしれません。
:::

　実行しましょう。
![S12_CharacterDesignAnimation_001 (DEBUG) 2023_03_06 0_21_58 (1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/691050/0b43510a-95d8-2dde-3ac1-3df2c80fd615.png)

以上