LemonteaのUnity部屋

LemonteaのUnity部屋

Unityの使い方とかです~

Unity Json形式とファイルへの書き出し・読み込み

こんにちは。レモンティーです。

昨日音ゲーの記事を書くと言いました。

今回は、その準備として、楽譜を書き出すのに
必要な三点の記事を書きます。

Json形式にしたり、戻したり
②ファイルへの書き出し
③ファイルの読み込み

です。

______________

Json形式

JsonとはJavaScript Object Notationの略で、データをテキストで記述する形式の一つです。
①では、↓の公式サイトを参考に、あるクラスの変数を丸ごとこの形式で表し、
stringの変数にいれてみます。

Unity - マニュアル: JSON 形式にシリアライズ


まずは、Json形式で保存したい変数をもったクラスをつくります。

この時、頭に[Serializable]とつけます。
(そのためには最初に using System; が必要)

[Serializable]
public class MusicScore
{
    public float Timing[];
    public float Notes[];
}

これをJson形式に変換するには
インスタンスを作成して…

MusicScore ms = MusicScore();

JsonUtility.ToJsonを使います。
これでできたJson形式のテキストは
stringの変数にしまいます。

なので実際に使うときはこんな感じです。
string json = JsonUtility.ToJson(ms);

これでmsの持っている変数の情報がすべてJson形式で表され、
string型の変数jsonに格納されました。


逆に、jsonファイルに書き込まれている内容を
あるインスタンスに反映させたい場合は

JsonUtility.FromJsonOverwrite(json, ms);


と書きます。

また、jsonファイルに書き込まれている内容を
新しく作ったインスタンスXに反映したい場合は
こう書きます。

X = JsonUtility.FromJson(json);



②ファイルへの書き出し

このままだと、ただstring変数に代入しただけで、
実行が終わったら消えてしまいます。

そこで、ファイルに保存してつかいます。

ファイルへの保存とかをいじるには、

using System.IO

を書く必要があります

書き出し処理は
File.WriteAllText(FilePath, json);
のように書きます。

jsonは、json形式でデータが書かれたstringの変数です。

FilePathは、ファイルの保存場所と名前です(string型)。

例えば
"Assets¥¥Test.json" なら
Assetsフォルダの中のTest.jsonというファイルに書き出されます。
(そのようなファイルが無い場合は自動で生成されます。)

"Assets¥¥ABC¥¥Test.json" なら
Assetsフォルダの中のABCフォルダの中の
Test.jsonというファイルに書き出されます。
Testファイルは自動で生成されますが、
ABCフォルダは自分でつくらないと、存在しなかった場合エラーになります。



③ファイルの読み取り

ファイルを読み取るには
File.ReadAllText(FilePath);
を使います。

先ほど同様
using System.IO
を書いておきます。

そして、string型の変数に↓のように取得します。
string json = File.ReadAllText(FilePath);

FilePathは先ほど同様、読み込むファイルの場所と名前です。

これで、保存した変数をjson形式で取得できるので、
①でやったように
JsonUtility.FromJsonOverwrite(json, ms);
インスタンスに反映すればOKです。


_________________




これをどう使うかというと
↓のように音符の流れてくるタイミングを
配列に記録して、それをJson形式で
ファイルに保存しておき、
実行時に読み込むわけです。

f:id:sawalemontea:20170922120424p:plain

なんか数字の羅列で一見使いにくそうすが
どうせインスタンスに反映するので

ms.Timing[〇] = ~;
のように完全にいつも通り使うことができます。

この例だと
赤線より上がタイミングで、下が音符の種類です。


これを使って楽譜を作っていきます。

今回はここまでです。

Unity パーティクル(7) Meshで3Dパーティクル 回転の調整

こんにちは。レモンティーです。

youtu.be


テクスチャを使えば自由な2D画像をパーティクルにできますが、
これを3Dでやりたい場合はメッシュを使います。

以前ここでチラッとやったことはあったのですが
Unity Particlesystem パーティクルを進行方向に伸ばす - LemonteaのUnity部屋
今回は自作のモデルで試してみます。


やり方はRendererモジュールの
Render ModeをMeshにして、好きなメッシュを選びます
f:id:sawalemontea:20170921154605p:plain


これでパーティクル一粒一粒がメッシュの形になりました。

しかし、向きが合っているとは限りません。

しかもパーティクルなので
Transformで回転させても粒は回らないので

メインのここで回転させます
f:id:sawalemontea:20170921154757p:plain


また、モデル用のマテリアルがある場合は
Rendererモジュールでそれを設定するといいです。

ただし、色のアルファ値を少し落としてあげげないと
見えないかもしれません。


これでモデルがパーティクルになりました。
f:id:sawalemontea:20170921155040p:plain


今回はこれでおしまいです。



最近自分が楽しんでるだけで有益な記事がなかったですが、
Jsonで簡単な音ゲーをつくったので
次からその作りかたとか書こうと思います。

それではさようなら~


関連
sawalemounity.hatenablog.com
sawalemounity.hatenablog.com
sawalemounity.hatenablog.com

Unity 中二パーティクル祭り

こんにちは。レモンティーです。

今回は、ただただ魔法っぽいパーティクルの
画像と動画を張るだけです

実用的というよりは遊びに走っています。

f:id:sawalemontea:20170920062455p:plain

この画像が個人的に好きだったのでつくりました

f:id:sawalemontea:20170920062539p:plain

f:id:sawalemontea:20170920062547p:plain


なんか似たような感じばかりになってきたので
そろそろモデルとかメッシュとか変わったテクスチャとか
使ってみたら毛色の違うものができるかもしれませんね


youtu.be

今回はこれでおしまいです

Unity パーティクル(6) 緑の文字列の雨 SF・サイバーっぽいタイトル画面

こんにちは。レモンティーです。

SFっぽい雰囲気のタイトル画面などで、
よく黒い背景に緑色の文字列の雨がふってるやつ、
ありますよね。

今回はParticlesystemのTextureSeatAnimationで
あれっぽい文字列の雨を作ってみたいと思います。

静止画だとこんなやつですね。
f:id:sawalemontea:20170920050821p:plain

今回は、文字を適当に書いたテクスチャを用意しました。
こんなやつです。
f:id:sawalemontea:20170920050950p:plain

今回はざっとつくったのでそろっていませんが、
きっちり1文字1文字を判読可能にしたい場合は
1文字がとるスペースはそろえる必要があります。
(例えばjとpではpのほうが横に広い)

ただ、もともと高度なことを書いているわけではないので
読めないほうが雰囲気でる場合もあります。

そこは好みですね


テクスチャを用意したら、
それをマテリアルに設定します
f:id:sawalemontea:20170920051647p:plain

そしてRendererモジュールで
つくったマテリアルを指定します
f:id:sawalemontea:20170920051718p:plain



TextureSeatAnimationモジュールで
コマ設定をします。
いつもは縦何コマ、横何コマ…とやるのですが、
今回は縦横がそろってないので適当です
f:id:sawalemontea:20170920051840p:plain


あとは緑色にして…
f:id:sawalemontea:20170920051906p:plain


メイン、Shape、Emissionを調整すれば完成です
f:id:sawalemontea:20170920051931p:plain


ちなみに他のShapeでもいくつか綺麗なorそれっぽいものがありました。

Donut
f:id:sawalemontea:20170920052135p:plain

Box
f:id:sawalemontea:20170920052406p:plain

Edge
f:id:sawalemontea:20170920052539p:plain

Sphere
f:id:sawalemontea:20170920052736p:plain

でも色に関しては
黒背景に緑がダントツでよかったです


今回はこれでおしまいです。



前回
sawalemounity.hatenablog.com

初回
sawalemounity.hatenablog.com

Unity パーティクル(5) 斬撃のエフェクト

こんにちは。レモンティーです。

今回は、ParticlesystemのTrailを使って
斬撃のエフェクトをつくってみたいと思います。

1 シンプルに切るだけ
2 中心に光
3 素早い6連撃

の3種類をつくります
ただし、主な部分は同じなので手間は一個分です

静止画像だと伝わりにくいですが、
こんな感じになります

f:id:sawalemontea:20170919181138p:plain

f:id:sawalemontea:20170919181209p:plain

f:id:sawalemontea:20170919181226p:plain


まず1をつくります

Rendererモジュールのマテリアルの設定からです
f:id:sawalemontea:20170919181602p:plain

Inviは透明マテリアルで、
Unity オブジェクトを簡単に透明にする - LemonteaのUnity部屋
TrailのはStandardAssetのやつです

そうしたらTrailモジュールをオンにします。

そして、色と大きさの調整です
f:id:sawalemontea:20170919181744p:plain

最後にメイン、Shape、Emissionを微調整します
f:id:sawalemontea:20170919181813p:plain

これで1が完成しました。

これを改造して2と3をつくります

まず2をつくるため、斬撃の中心に光りをつけます。

これは、Rendererモジュールのマテリアルで、
メインのマテリアルをInviから↓のように変更すればできます。
f:id:sawalemontea:20170919181859p:plain

これで2のできあがりです。


3をつくるには、
2のEmissionモジュールの
Rate Over Timeを変更します
(あと色も変えてます)
f:id:sawalemontea:20170919182106p:plain


これで3もかんせいです。



それでは1,2,3を順に再生してみます

youtu.be

斬撃に見える…と思います(゜゜)

属性とかつけたらもうちょっといいかもしれませんね



今回はこれでおしまいです

Next
sawalemounity.hatenablog.com
前回
sawalemounity.hatenablog.com
初回
sawalemounity.hatenablog.com

Unity パーティクル(4) 炎の属性付き打撃

こんにちは。レモンティーです。

以前、このシリーズ(3)でUnityのParticlesystemをつかって
衝撃・打撃エフェクトをつくりました。
Unity パーティクル(3) 衝撃・打撃エフェクト - LemonteaのUnity部屋


今回は、その周りに炎属性っぽいオーラを追加して、
炎属性付き攻撃みたいにしてみたいと思います。

静止画だとこんな感じになります
f:id:sawalemontea:20170918112602p:plain


ではさっそく作ってみます

ベースは(3)で作ったこの打撃エフェクトです
f:id:sawalemontea:20170915221307p:plain

これに、炎っぽいオーラを重ねます。

今回重ねたのはコチラです
f:id:sawalemontea:20170918113142p:plain

これをつくっていきます

まず、Rendererモジュールでマテリアルの設定をします
f:id:sawalemontea:20170918113407p:plain

メインのInviというのは、自分でつくった透明なマテリアルです。
Unity オブジェクトを簡単に透明にする - LemonteaのUnity部屋
このオーラはTrailでできていて、本体は消してあるということです

Trail用のマテリアルは、StandardAssetのやつです。



次に、Trailモジュールにチェックをいれます。
これでTrailがでるようになります。
設定はデフォルトのままです。

例によって、Noiseモジュールも使います。
f:id:sawalemontea:20170918113902p:plain
こんな感じです。

そして大きさと色を調節します
f:id:sawalemontea:20170918114054p:plain

最後にメイン、Shape、Emissionを微調整したら完成です。

再生するとこんな感じです。
youtu.be

爆炎っぽいですね。
炎属性に見えます(゜゜)

今回はこれでおしまいです。


前回
sawalemounity.hatenablog.com

Unity GetSpectrumDataで音程で上下動するキューブ

こんにちは。レモンティーです。

今回は、BGMの音程に合わせて上下運動するキューブを
AudioSourceのGetSpectrumDataをつかって
作りたいと思います。

とはいったものの
私はそっち系の知識が0で、
フーリエ変換、窓関数、チャンネル、アウトプットサンプルレートなどの
基本となる単語の意味すら全くわからなくて
ググりながらやったので
めちゃ大胆に間違った事を書いているかもしれません。
発覚したらそのとき訂正します

やることは、
キューブのy座標を0.5秒に一回更新
その座標は、その時一番強く鳴ってる音の周波数(高さ)
という感じです。


周波数は、
AudioSourceのGetSpectrumDataを元に求めます。

これは
GetSpectrumData(float samples, int channel, FFTWindow window);
のように使うと
引数に入れたfloat型の配列にデータを入れてくれるものです。

データが帰ってきた配列には、
各周波数の音の強さが入っています。

ある瞬間になっている音には
様々な周波数の音が入ってるので
各周波数の音がどれくらいの強さか教えてくれているわけです。

しかし、周波数は連続した値なので
全てについて答えることは不可能です

帰ってきた配列には、飛び飛びの周波数ごとの
強さが入っています。

例えば、
AudioSettings.outputSampleRateをA
引数の配列Sampleの要素数をBとすると、

Sample[i]には
周波数 i*A/2B Hzの音の強さ
が入った状態でかえってくるみたいです。

要は、最小単位A/2Bの整数倍の周波数の音の強さだけ
調べてくれるということです

ここで注意しなければならないのは、

Bは
2のべき乗で
範囲は64~8192(両端含む)

でなければならないということです。

↑を満たしていれば自由です。


さて、これを使って一番つよい音の高さを求めるには
Sample[i]が最大になるiについて
i*A/2Bをすればいいことになります。

私の場合、Aはデフォルトで44100Hzで、
配列の要素数は1024でやったので

周波数f = i * 44100/2048 ですが
キューブのy座標にはでかいので1/100して使います
(だったらもうiに比例してればなんでもよさそうですけどね笑)

これをコルーチンで0.5秒に一回計算すれば
冒頭でいったやることは実現したことになります

それでは実行してみます

youtu.be


…………

…これは残念なできですね笑

しかし、曲の終わり際とか、明らかに大きい音のときは
それっぽい動きをしています。

つまり、根本的に違うと言うよりは
背後の音の方が強いと判定されたときに
しっくりこない動きをしているのかもしれません。

まだ改善の希望はありそうです笑

今回はこれで終ります。



Audio関連
(こっちは普通に目的達成してます)
sawalemounity.hatenablog.com
sawalemounity.hatenablog.com