Anima2Dを使ってみたところ
今年からAnima2Dが無料でUnityで利用できるようになりました。
Anima2Dってなんなの？というところからですが、Spineと同じようなものと書かれていました。
Spineってなんなの？っていう方は
こちらから確認してみて下さい。
Anima2Dを落としてくると中にサンプルのシーンがあるので、どんなものか確認してみてから同じものを実際に自分で作ってみようと思います。
シーンに映っているのが完成品です。
まず画像を切り抜いていきます。
その後に、右クリックからAnima2Dを選択してSpriteMeshを選択して下さい。
そうするとそれぞれの切り出したパーツがSpriteMeshとして生成されます。
これを組み立てて実際にT-Rexを作っていきます。
空のオブジェクトを作ってその中にさらに空のオブジェクトを作成してSpriteMeshesという名前にしてそれぞれのパーツを入れていきます。
配置が完了したらBonesという空のオブジェクトを作成して、そこから右クリック2D Object→BoneをクリックしてBoneを作っていきます。
Boneがどこの部位のBoneなのか名前をつけて管理していきます。
オブジェクトに入っているBoneに関しては親のBoneとの繋がりを持ちますのBoneの構造上、繋がっていた方がいいものに関しては子オブジェクトに追加していく形になります。
子オブジェクトに追加しない場合は連結されないので独自のBoneの動きになります。
ちなみにBoneを配置しただけではBoneを使って動かすことが出来ません。
Assetの中にあるSpriteMeshをクリックするとInspectorにEdit Sprite Meshというボタンがあるので、それをクリックしてEditorを開きましょう。
こんな感じですね。
その次にSpriteMeshesの中にあるSpriteMeshをクリックしてSetBonesにBoneをセットしていきます。
Bindを押したりしてApplyを押すとBoneの設定が出来たと思います。（若干前にとったスクショでうろおぼえ・・・）
それでは実際にBoneを曲げてみましょう…
もうちょっと勉強してきます！！
パーティクルが四角いピンクになった時は・・・
エディター上では上手くいっていたけどビルドしてみると画面にちゃんと映っていたパーティクルがピンクの四角になっちゃうことがあったりします。
WebGLでの開発をしていて結構ここで躓いてしまったので、メモで残しておきます。
Shader shad = Shader.Find("なまえ");
obj.GetComponent<Renderer>().shaderMaterial.shader = shad;
一先ずこれでいけるのですがShader.Find()だけでは参照出来てないのかで症状が改善されないことがあります。
そういう場合はUnityエディタのメニューからEditを選択してProject Setting、Grahicsを選択してクリック
そうするとInspectorの下の方にAlways Included Shadersとあるので、そこに参照したいShaderを選択しておけば漏れなくShader.Find()で呼び出すことが出来ます。
初期値はSizeが７になっているので、参照したいShaderを追加したい場合はSizeの数を大きくして追加して下さい。
これでShader.Find()で参照できない問題は解決しました。
Video Player
Unity5.6bからVideo Playerが追加されましたね。
ファイル形式はmp4を使用しています。
mp4のファイルをProjectにドラッグアンドドロップで追加して下さい。
追加したファイルをそのままHierarchyにドラッグアンドドロップで追加します。
追加したらそのままUnityを再生させるとこんな感じに
ただ、そのまま再生すると音声が流れなかったのですが、InspectorのAudio Output ModeをDirectからAudioSourceに変更して
AudioSourceをAdd Componentで追加します。
追加したAudioSourceをアタッチしてから再生すると
音声が再生されます。
Renderer Textureを使ったりすると３Dオブジェクトにそのまま動画を流し込めたりするのでいろんな使い方が出来そうですね。
Movide Textureと比べると圧倒的に軽いという事なので、今後使用されることも多くなりそうです。
※QuiqTimeが必要かも
SpriteEditorの新機能Edit Outline
前回のSpriteEditorの使い方で画像が重なっている場合は綺麗に切り取れないと書いたのですが、Unity5.6bから追加された新機能で切り出す範囲を細かく指定する事が出来るみたいです。
SpriteEditorの左上からEdit Outlineを選択して
範囲を選択したい画像を選択。
こんな感じで頂点の位置を移動させるだけで（頂点を新たに追加することもできます。）
これまで切り取れなかった形の画像も簡単に切り取る事が出来ます。
またまた便利になりましたな。
SpriteEditorの使い方
初歩的な部分で今更ですがSpriteEditorの使い方をまとめておきます。
SpriteEditorの使い方
まず適当にこんな画像を準備しました。
背景が白くなっていますが、白い部分は透過処理しています。
透過処理しておかないとSpriteEditorで切り出すときに一枚の画像として認識されてしまいます。
SpriteEditorで使うにはまず画像をUnityのプロジェクトにドラッグアンドドロップして下さい。
ドラッグアンドドロップするとUnityのProjectにTestImageが表示されるのでそれをクリックして下さい。
クリックするとInspectorに詳細が表示されるのでSprite ModeをSingleからMultipleをクリックして選択した後にSprite Editorをクリックして下さい。
これはApplyを押して下さい。
クリックするとSprite Editorが開きます。
SpriteEditorが開いたら左上のSliceをクリックして下さい。
TypeはAutomaticのままSliceボタンをクリックするとUnityが自動で画像を1つ1つ切り分けてくれます。
切り分けられると下記のようになります。
OKであれば右上のApplyボタンを押すと切り分けを実行してくれますが、ここで気を付けたいのが一番下の三角形の画像です。
基本的にUnityで切り分けする場合には縦と横の頂点を取得して四角形にしか切り出しをしてくれません。
なので三角形のものも四角形にしか切り出すことが出来ませんので最初に準備した画像のように四角形が重なるように画像を並べると綺麗に切り出してしてくれません。
綺麗に切り出したい場合は下記のように画像を並べ直さなければいけません。
こうすると綺麗に一つ一つパーツを綺麗に切り出してくれます。
UIなどの部材を作る場合に一つの画像にまとめる場合などには気を付けないと手直しする事にもなるので面倒事が一つ増えてしまいます。
MaxSizeの設定
画像を選択してInspectorの下にMaxSizeというものがあるのですが、これは低ければ低いほど画像のファイルサイズは小さくなりますが、もともとの画像の解像度を大きく下げてしまう場合があります。
試しに128に設定してSpriteEditorを開いてみると
こんな感じでとても汚くなります。
もともとのサイズが370×1426のサイズでしたので1426以上のサイズに設定しなければもともとのクオリティを保持する事が出来ません。
加えて画像がぼやけてしまうのでサイズが微妙にずれてしまうという事があるので、気をつけたいところです。
デフォルトは2048に設定されているのでそれ以上に大きいサイズの画像を使用する場合はMaxSizeを設定してみて下さい。
InvalidOperationException: Collection was modified; enumeration operation may not execute.が出た場合
このエラーが何度か出てコードを見返しても原因がわからなかったのでgoogle先生に翻訳してもらったところ。
InvalidOperationException：コレクションが変更されました。 列挙操作が実行されないことがあります。
という事でした。
調べてみると処理中にコレクションに追加・削除などの処理が加わるとコレクションの中身を変えるんじゃない！という事でエラーが吐き出されてしまうようです。
解決策として考えたのはListにしてしまおうという事で解決しました。
List<型> hoge = IEnumerable.ToList();
Listにしてしまえば処理中に変更を加えても大丈夫みたいです。ToArray()とかでもOKのようです。
