[Unity]シンプルな音ゲーの作り方 part1　譜面作成


# 結果
![MusicGameResult.gif](https://qiita-image-store.s3.amazonaws.com/0/113504/69ca8124-0882-50bc-73fb-f13aa3066f49.gif "MusicGameResult.gif")

[完成物Githubリンク](https://github.com/teach310/SimpleMusicGame)

# 対象
- 音ゲー作ってみたいけど，何をすればいいか分からない人

# 前提知識
- GetComponentが使えること


# リンク
part1 この記事
[part2](http://qiita.com/Teach/items/e8343fe0405da7ebd5fc)

# 作成手順
## 1. 譜面作成用のシーンの作成
1. 譜面データの形式を決める．
2. 押したタイミングをCSVに保存

背景音楽に合わせてキー入力をし，そのタイミングを保存します．
そうすることで，楽に譜面を作成することができます．

## 2. ゲームシーンの作成
1. CSVを読み込む．
2. タイミングにあわせてノーツを生成
3. ノーツが降ってくるようにする
4. タイミングよく押したらGoodにする．



# 譜面データの保存
# 1. 譜面データの形式を決める．
<img src = "https://qiita-image-store.s3.amazonaws.com/0/113504/f24ef529-298b-3a06-cecd-0f73f905f1c1.jpeg" width = 480px>

左の列がノーツが落ちてくる時間(単位は秒)，
右の列が落ちてくる場所です．

<img src = "https://qiita-image-store.s3.amazonaws.com/0/113504/5de6304d-8a2d-aa7b-3387-727bd9aba305.jpeg" width = 480px>

ここでは，落ちてくる場所にやって押すキーが変わっています．

|場所|キー|
|:--:|:--|
|0|KeyCode.D|
|1|KeyCode.F|
|2|KeyCode.Space|
|3|KeyCode.J|
|4|KeyCode.K|

# 2. 押したタイミングをCSVに保存

書き込む内容が決まったので，実際に保存していきます．

これはさらに以下の手順に分けられます．

## タイミング保存への道
1. ボタンを押したら音楽を再生する機能を作成
2. CSVに書き込むスクリプトを作成
3. キーを押した時間と，押したキーを取得するスクリプトを作成

##　1. ボタンを押したら音楽を再生する機能を作成
まずはプロジェクトを作成し，シーンを保存します．

ここでは`NotesTimingMakeScene`という名前で作りました．

次にUIを以下のように，テキストとボタンを作成します．

![スクリーンショット 2016-09-08 17.36.03.png](https://qiita-image-store.s3.amazonaws.com/0/113504/a8123395-fe3c-23ff-0aa0-dd665fec3f16.png "スクリーンショット 2016-09-08 17.36.03.png")

このボタンが押されたら音楽を再生するようにします．

NotesTimingMaker.csというスクリプトを作成しましょう．

```csharp:NotesTimingMaker.cs
using UnityEngine;
using System.Collections;

public class NotesTimingMaker : MonoBehaviour {

	private AudioSource _audioSource;

	public GameObject startButton;

	void Start () {
		_audioSource = GameObject.Find("GameMusic").GetComponent<AudioSource> ();

	}

	void Update () {
		
	}

	public void StartMusic(){
		startButton.SetActive (false);
		_audioSource.Play ();
	}
}
```

このスクリプトを使うためにいくつかの準備が必要です．
### NotesTimingMaker
1. 空のオブジェクトを作成し，NotesTimingMakerと名付けます
2. NotesTimingMaker.csを今作ったオブジェクトにアタッチ
3. StartButtonにCanvas直下のStartButtonをアタッチします．
![ img_ntm.jpg](https://qiita-image-store.s3.amazonaws.com/0/113504/ee0a9bf2-f95d-8020-084c-ecfa560f25fc.jpeg " img_ntm.jpg")

### GameMusic
1. 空のオブジェクトを作成し，GameMusicと名付けます．
2. AddComponentでAudioSourceをアタッチ
3. AudioClipに音楽ファイルをアタッチ
4. PlayOnAwakeのチェックを外す
![img_audio-1.jpg](https://qiita-image-store.s3.amazonaws.com/0/113504/76ef36b3-b401-d3e8-c895-613aa1db0915.jpeg "img_audio-1.jpg")

### StartButton
1. StartButtonのButtonコンポーネントの下の方にあるOnClickの項目のplusボタンを押す．
2. NotesTimingMakerのオブジェクトをアタッチする
3. メニューからStartMusicを選択する．
![img_button-1.jpg](https://qiita-image-store.s3.amazonaws.com/0/113504/eb6869a2-f23b-f39e-aebd-989e9f9ed0d8.jpeg "img_button-1.jpg")

これで，再生してボタンを押すと音楽がなるようになります．
第一ステップクリアです．

## 2. CSVに書き込むスクリプトを作成

新しくCSVWriterというスクリプトを作成して以下のように記述してください．

```csharp:CSVWriter.cs
using UnityEngine;
using System.Collections;
using System.IO;  // <- ここに注意

public class CSVWriter : MonoBehaviour {

	public string fileName; // 保存するファイル名

//テスト用
//	void Start () {
//		WriteCSV ("Hello,World");
//	}

	// CSVに書き込む処理
	public void WriteCSV(string txt){
		StreamWriter streamWriter;
		FileInfo fileInfo;
		fileInfo = new FileInfo (Application.dataPath +"/"+ fileName + ".csv");
		streamWriter = fileInfo.AppendText ();
		streamWriter.WriteLine (txt);
		streamWriter.Flush();
		streamWriter.Close ();
	}
}
```

### CSVWriterを使う手順
1. CSVWriterという名前の空のオブジェクトを作成
2. 作ったオブジェクトにCSVWriter.csをアタッチ
3. ProjectビューのCreateからフォルダを作成
4. Resourcesと名付ける．そして，その中にCSVというフォルダを作る．
5. CSVWriterのFilenameに「Resources/CSV/TestTiming」と入力
6. 再生

![img_writer.png](https://qiita-image-store.s3.amazonaws.com/0/113504/fb6d28b7-1da9-8ede-70ec-6a7a3da3fa38.png "img_writer.png")


テスト用と書いてあるコメントアウトしている部分を解除して再生してみてください．

再生してすぐにはできていないと思うので，その場合は再生を停止し，
CSVフォルダを右クリック => Show in Finder もしくはExploreで開くみたいなのを選択してCSVフォルダ内を確認すればできていると思います．

エクセルでCSVファイルを開きHelloWorldと書いてあればOKです．


## 3. キーを押した時間と，押したキーを取得するスクリプトを作成
NotesTimingMakerを以下のように変更してください．

```csharp:NotesTimingMaker.cs
using UnityEngine;
using System.Collections;

public class NotesTimingMaker : MonoBehaviour {

	private AudioSource _audioSource;
	private float _startTime = 0;
	private CSVWriter _CSVWriter;

	private bool _isPlaying = false;
	public GameObject startButton;

	void Start () {
		_audioSource = GameObject.Find("GameMusic").GetComponent<AudioSource> ();
		_CSVWriter = GameObject.Find ("CSVWriter").GetComponent<CSVWriter> ();
	}

	void Update () {
		if (_isPlaying) {
			DetectKeys ();
		}
	}

	public void StartMusic(){
		startButton.SetActive (false);
		_audioSource.Play ();
		_startTime = Time.time;
		_isPlaying = true;
	}

	void DetectKeys(){
		if (Input.GetKeyDown (KeyCode.D)) {
			WriteNotesTiming (0);
		}

		if (Input.GetKeyDown (KeyCode.F)) {
			WriteNotesTiming (1);
		}

		if (Input.GetKeyDown (KeyCode.Space)) {
			WriteNotesTiming (2);
		}

		if (Input.GetKeyDown (KeyCode.J)) {
			WriteNotesTiming (3);
		}

		if (Input.GetKeyDown (KeyCode.K)) {
			WriteNotesTiming (4);
		}
	}

	void WriteNotesTiming(int num){
		Debug.Log (GetTiming ());
		_CSVWriter.WriteCSV (GetTiming ().ToString () + "," + num.ToString());
	}

	float GetTiming(){
		return Time.time - _startTime;
	}
}
```


これで，背景音楽に合わせて対応するキーを押せば，そのタイミングがcsvに書き込まれるようになります．

part2ではノーツの機能，キー入力で可否の判定の製作を行います．