
初心者がUnreal Engine 5でPCゲームを作る Day4 ~ SpineモデルをUEで動かす
Day4まとめ
プロジェクトを立て直すのはこれぐらいにしておこうな
SpineのAnimation関数完全に理解した
Set Animation関数で強制的に指定したアニメーションに設定
Add Animation関数で指定したアニメーションを次に再生
再生の塩梅はDelayで調整する
Add / Set Empty Animation
トラック(レイヤー)で重ねて再生できる
0番が一番下
未来のことを考えた開発
ディレクトリ整理
Unrealはディレクトリ構造を後から動かすのがとても苦手らしい。
とはいえ、どのようなファイルが生成されていくのかよくわかっていないので、今は一旦以下のみ行った。
プロジェクト名のフォルダを親にする
SpineデータをCharactersフォルダ以下にキャラ名を添えて整理
Coreフォルダにブループリントをまとめる
Spineのデータをリネーム
SPINE_skeltonname
BPのみに依存するなかれ
BPは結構重くなってくるらしい。
C++でできることはC++でやった方がいいみたい。
特に変数を扱う場合はC++のがいいそうなので、ゲーム処理を書くときはC++を使うことを検討した方がいいかも。
Spineキャラを動かしたい
Day1でインポートまで済ませたキャラクターを動かしたい。

インポート後の対応について公式の使い方動画があった。
Actorに対してBPを設定。
イベントグラフにSet Animation関数を配置。
EventBeginPlayから実行で指定。
AnimationNameにidleを指定しLoopにチェック。
これで完璧に動くはず! とくと見よ!

カメラがおバグりになられていた。
なんか上下に動いているので多分アニメーション自体は無事できている。
ブランクプロジェクトからやり直す
Day3でやった通り、ActorにSpringArmを取り付けカメラを設置しているが、それとは関係のないカメラが使用されている模様。

保存しようとしたときにプロジェクトにもともと入っているマップデータがバグって保存できないという事象も発生。
問題を手元でコントロールできる範囲にとどめるため、ブランクプロジェクトからやり直す。

カメラの再設定
ActorじゃなくてCharacterで作り直せばいいのでは
CharacterにすればGamemodeから主人公として設定することができ、
そうするとカメラも機能する気がする。

機能した。
Gamemodeを新規に作ってデフォルトのポーンクラスに設定したら無事出た。きのうのチュートリアルが早速生きてうれしいね。
境界線描写をなくしたい
口の周りや目の周りなど、パーツの境界線に描写が追加されている。
上記症例はUnityでの報告だが、エクスポートの設定で問題が起きているようなのでUnrealでも同じ現象のはずだ。
公式ドキュメントも確認してみると、
「Spine-UEは乗算済みアルファをサポートしていません」
とのこと。書き出しで乗算済みアルファを外して再度インポートする。
すると……クラッシュした!
プロジェクトをみだりにクローンするなかれ
一度Spriteとboneを削除して再読み込み
クラッシュした
インポートそれ自体に何か問題がある
テキトーなpngファイルだけインポート
何も問題なかったので、Spine-UEの問題っぽい。
.atlasをインポート
問題なくインポートできた
.jsonをインポートしようとして死んでいる。
とりあえずここまで特定した。
前回エラーを特定したときのように再度ビルドをかけようとフォルダ内を検索してみると、プロジェクト名がクローン前のままのファイルがめちゃくちゃたくさん残っている。
Unrealではプロジェクトの名称変更はサポートされていませんと言われたがこういうことか。
おとなしくファイル全消ししてゼロからプロジェクトを立て直すことにする。
立て直してみた。

マジすか?
一旦Spine-UEの最新をpullして再度導入してみる。

あっさり成功した。
プロジェクト作り直しまくってるうちに何か間違えてたのだろう。
予想だがSpine-UEのプラグインフォルダを別プロジェクトからコピペしたのがおそらくよくなかった。プロジェクトごとに何かファイルを生成しているっぽいので、そいつの参照がイカれたのではなかろうか。
気を取り直してインポートしたファイルを確認。

レンダリング設定を変更したら境界線はちゃんと消えた。よし!
アニメーション設定
モーションさせると残像が残って見えるのをなんとかする
モーションブラー削除
変わらず。
アンチエイリアスのモードをFXAAに変更
いい感じになった!
キー入力に反応して動かす
ADキーで左右移動
WSキーで上下移動
組み合わせて斜め移動もできるように
左クリックで杖を振る
右クリックで本を開く
後々、再度右クリックで本を閉じられるようにする
という動作を仕込んでみる。
対応するInput Systemを用意した。

WASDでの移動
まずはDay3でやったチュートリアルの通りに組む。

今のカメラが真横から見ているので、このままではY軸動作がよくわからんはず。
カメラ視点を変更する。

動いているのがわかるように、Planeと目印になるCubeを何個か配置し、マテリアルを設定する。
マテリアルの配置場所はこれに倣って以下とする。
Project
Material Library
Debug
デバッグ用のマテリアルが製品に入らないように整理できるね、ということらしい。
サイズ確認用のハリボテActorと、CubeとPlaneを照らすDirectional Lightを設置する。

そしていざ再生すると……動けない。
一応仕込んだクリックでのアニメーションも発動しないと思ったらキーマップをAdd Mapping Contextにアサインし忘れていた。

怪しすぎる動きの修正
とりあえず動けた。

左右反転とか移動速度とか、Cubeの陰影とかその辺は置いておいて、
杖、本
クリックしっぱなしでタメが発生
ダッシュ
アニメーションが移動中ずっと再生になってない
のを修正する。
杖、本は発火をTriggeredからStartedにしたらいけた。
タメれるものはTriggered、タメれないものはStartedとしよう。
ダッシュはできるかな~と思って座標移動の後にルーティングさせてたけどダメそうなのでおとなしくチュートリアル通りのTick処理に書き換える。
いやまてよ。TickごとにIdleになるようになんて設定したら杖振るモーションとか上書きされないか。
まあ一回実装してみるか。
アニメーション管理方法を探る
Tick + Set Animationでの実装による不都合
idleにしてもDashにしても毎Tickやろうとする
1コマ目しか出てくれない
他のアニメーションを再生できない
先ほどの動画の続きで解決法が指示されていたので確認する。
アニメーションはTrackという概念で管理されている
絵で言うレイヤーのようなもん
Track0が一番下
数字が大きいアニメーションが上
Track0にIdleを設定
Track1にアクションを設定
アクションが終わったらTrack1を消す
Add Empty Animation 1回全部再生させたい場合
Set Empty Animation キーを離したらソッコー元に戻したい場合
すると下でずっと回っていたIdleが現れてくれる
Track0にダッシュを設定
キーを離したらTrack0でまたIdleを再生し始めるように
という感じで処理するみたい。
Dashの処理
一旦できた。

XYを別々で扱うからこんなことになる。
アニメーションも割愛するがバグっていて、ナナメ移動の後一方向移動に戻るとIdleになる。
処理を簡易にするためにInputをVector2Dにする。
デフォルトでX軸に1とされるため、
Y軸にする場合は「スイズル入力軸値」を設定する模様。
これとNegateを組み合わせて入力方向を指定するというわけだ。


これ、本がフワっと追従してくるようにとかできたらアツいな。
Todoに追加しておこう。
明日以降はアニメーション遷移をさらに突き詰めていく。
具体的には、開いた本を閉じるアニメーションを追加する。
条件式をうまく使わないといけなさそう。