Google

2016年9月28日水曜日

Unreal EngineでMatinee速度変化処理3

長くてすみませんが、今回が最後です。
前回はマチネでルートを作成する部分まで終わらせました。

今回はマウスイベントや速度増減に関する処理を入れ込みます。
アニメーションツールであるが故にMatineeには再生速度がありますが、元々GUIで指定する固定値となっています。
今回はそれをBluePrintから制御することで、アクセル的な機能として実装してみます。
C++で処理すれば短いコードになるのですが、それでは面白みも無いかと。

概念としてはこんな感じです。
  • マウス左ボタンがアクセル
  • 離せばブレーキ
  • 押してすぐ動くのではなく、段階的に加速減速
  • 再生レートの上限下限を作る
  • マチネの再生レートを変化させてこれらを実現
では始めます。
今まで作成してきたマチネはもう良いので、レベル全体のビューポートに戻ります。
画面上部からブループリントというアイコンメニューを探してクリック。


メニュー一覧から、レベルブループリントを開いて下さい。
このレベル(Unityで言う所のシーン)全体の処理実装です。


開くと当然ながらまだ何もありません。

変数作成

まずはここに変数を作っていきます。
左側にある変数の+ボタンを押して、変数を2つ作成します。


上図の通りに作成しましょう。
以下の項目2つが必要です。
  • pressFg
    • Boolean
  • speedRate
    • float
変数を作った際、一度はコンパイルしないと初期値が入りません。
初期値は通常の高級系言語と同じように、falseと0.0にしておいてください。

コンパイル前
コンパル後

図のようになっていればOKです。
pressFgはマウスの状態記憶に、speedRateはマチネの再生レート制御に使います。
一旦変数に格納するのは元々のプロジェクト上の都合と、連続して飛んでこないイベント等への対処です。
さらに簡易な方法もありますので、あくまで一例と考えて下さい。

マウスイベント処理

さらに続けて、ここにマウスイベントで変数の値を変化させる処理を付けます。
画面上には「右クリックして新規ノードを作成」とありますが、その辺の何もない部分で右クリック。
以下のような一覧が表示されます。

この中から目的の項目を探すのは大変です。
また、条件によって項目があったりなかったりするので、道筋から外れた操作をすると戸惑ってしまうと思われますのでご注意を。
そして欲しい項目を検索するには前方一致検索が1番便利です。


前方一致検索は枠の上部にあるテキストボックスで行います。
まず、ボックスにmouseと入れて下さい。近似の候補が出ます。
そして、その中から「マウスの左ボタン」という項目を選択して下さい。


マウスボタンイベントハンドラ用ノードができました。
続けて、先程の変数、pressFgをビューにドラッグ&ドロップ。
変数の項目からぐいっと持っていくやり方が簡単です。


ドロップするとサブメニューが出るので、セットを選択。
これを2個作成して下さい。


こうなりました。
これをつなぎ合わせます。
そして上のセットのチェックマークを付けましょう。付いていると真として扱います。


これでマウス状態を変数に記憶する処理が完成しました。
押したら真に、離したら偽になります。
これはここで完結するので、後はほっといて大丈夫です。

毎フレーム処理

続いてまたなにもない場所で右クリック。
tickと入れて、イベントTickを作成します。


これは毎フレーム飛んでくるイベントです。UnityだとUpdate()にほぼ該当します。
ここで監視を行い、マチネ再生速度の変更を行います。

Tickを作ったら、先程のプレスフラグを今度はゲットでドラッグ&ドロップ。



上図のようにプレスフラグの状態を常に見続ける準備ができました。
しかしこの再生レート、無制限に値が変化してはたまりません。
上限の再生レートを1.0、加減を0.0とします。
つまり、1倍の速度が最大で、離したら0倍、すなわちストップ状態を再現することになります。

なにもない場所で右クリックし、branchと入力し選択。



ブランチが生成されたら、上図のように白線と赤線をつなぎます。
白線はコンテキストなので、これが繋がらないと処理が動きません。赤線は参照です。
ちなみにこのブランチはプレス状態を判断するif文です。

続けて、上限と下限の値である1.0と0.0を準備します。
これはリテラル値として扱います。
なにもない場所で右クリックし、literalと入れて下さい。


似たようなのがあって紛らわしいですが、Make Literal floatを2個造ります。


片方に1.0と入れましょう。
そしてこれらと比較すべき変数、speedRateをドラッグし、ゲットで作成します。


こんな感じになりました。

今度は比較演算子です。このあたりがBluePrint使ってて嫌になる所orz。
なにもないところで右クリックし、>を入力。
これもまた、floatでなければならず、紛らわしいので注意を。



そして上図のように2つ作成します。
この演算子、コネクタの上下位置で比較する前後が違う点には注意。

そしてこれを比較演算の結果を判断するブランチを2つ生成します。
これは「1.0 > 変数」と「変数 > 0」の2つを行うためです。
ちなみに、以下の図のように既に存在するノードを右クリックしてDuplicateすると簡単にコピーが作成できます。


そしてやや分かりづらいですが、生成した演算子、ブランチを以下のように結びます。
左側に隠れて見づらいのは、最初のイベントTickから出ているマウス押下フラグのブランチです。
演算子のコネクタ上下の位置に注意して下さい。


C++でコードを書けば簡単なはずのマウス押下状態フラグと、float比較がこうなってしまうのが頭の痛い部分です。

次は加速減速の変化値です。
先程1.0と0.0を作った方法で、0.05という値のリテラルを追加します。
この値は加速減速の変動値として使います。


そしてまた右クリックで出るウィンドウで、+を入れます。
紛らわしいfloatのプラス演算にご注意を。


プラスが作成されたら、再度sppedRateからドラッグし、今度はセットで生成して下さい。


プラス同様にマイナスも造り、さらにspeedRateのセットも追加で造ります。
合計でプラスとマイナス、speedRateのセットが2個の合計4個です。
speedRateも必要なので扱いやすい位置に引っ張るか、ゲットのノードをもう一個作っておきましょう。


かなり複雑になってきましたが、上図のようになります。


上限、下限のブランチからセットにコンテキストのラインを接続します。
これは判断の結果、処理が真ならspeedRateに新しい値を入れることを意味します。


残りを接続するとこうなります。
speedRateが1.0より少なければ0.05を加算してspeedRateに加算、speedRateが0より大きければ0.05を減算、その結果をspeedRateに代入という流れです。

再生レート変更処理

そしてこのspeedRateの値をマチネの再生レートに入れ込みます。
一度ビューポートやアウトライン等でMyMatineeを選択しておいてからレベルブループリントに移動し、なにもない場所で右クリックした際、MyMatineeへのリファレンスを作成という項目が存在しているはずです。
Unrealではこのビューポートでの選択という操作がキモです。これをやらないために検索しても出てこない等、無駄に時間を食うつまづきが多いかも知れません。

これを選択して下さい。


すると以下の図のようなノードが生成されます。


この青いコネクタからドラッグし、なにもない場所でマウスを離してみましょう。
こんな一覧が出ますので、Rateと入れて下さい。


ここからSet PlayRateを選択します。
つまり、MyMatineeの再生レートのセッターです。


このようなノードが生成されます。
speedRateの値をマチネの再生レートに代入し、イベント処理が完成します。


セットされたSpeedRateをつなげて完了です。
お疲れ様でした。

途中、分かり辛い点があったかと思いますので、レベルブループリントの全体図をアップしておきます。



しかし簡単な処理だけでもこの長さ、、、

ツールのモードや癖に対応

さて、まだこのままでも処理は繋がりません。
UnrealやUnityで微妙な部分の一つかと思うのですが、ツールの癖を理解して、他の機能とバッティングしないように調整するという処理です。

まずはその証拠に、このまま保存、コンパイルして実行してみましょう。


まだThirdPersonが動いてます。
これは今回のワールド設定、レベル設定、BluePrintの構造上からプレイヤーが優先されて、マチネとそのディレクタが動いていない事を意味します。

そこでここからが本当に最後の修正。

まずはマチネを実行時に動作させるように修正します。
固定で処理する場合、アウトラインからMyMatineeを選択し、詳細画面にあるPlay on Levelにチェックを付けます。
まずこれでマチネがレベルロード時に自動的に動作するようになりました。
他にも方法はあり、BluePrint側でBeginPlayイベントで動かしてもどちらでも構いません。


また、BluePrintの構造上、レートの初期値がゼロだと正しく動作しないため、speedRateの値を0.1にして、初回に減衰するようにしておきます。
ちょっとこの方法はアレな感じですが、サンプルという事なのでご勘弁を。


これでレベルに戻って実行して下さい。
全ての処理が終わっていれば、動画のようになるはずです。


マウスが押されれば加速し、戻せば減速します。
ブレーキは付けていませんが、減速を極めて小さくして右クリック等に割り当てる等々、この仕組みに追加するのは比較的簡単でしょう。

また、加速減速の0.05という値を変更すれば加減速のレートを変更できますし、マチネのシステムレート上限は1.0ではありませんので、最大値のリテラルを大きくすればジェットコースターも可能です。

終点まで戻るとまたThirdPersonに戻りますが、マチネ側でイベントを作って再度再生し直す等の方法で無限ループも可能です。
実践ではマチネとキャラクターを混在させて処理するなどのケースも考えられるため、敢えてこのまま残してみました。
また、今回はThirdPersonをベースにしましたが、GameModeやControllerを作ることでキャラクターを無効化しマチネをメインとした事も可能です。

基礎構造の紹介という事でこの記事はここまでですが、改造し易い余地は残してあるつもりです。
デモプロジェクトはサイズが大きいのでちょっと躊躇しましたが、一応アップしておきます。

  ANGEWORK 公式pubフォルダよりダウンロード
  AcceleratorProject.zip(842,445,392 byte)
  MD5:229651aaf76f7e544739bea8c0d273b3

また、Unreal環境が無い方のためにHTML5版に変換したプロジェクトもアップしました。
変換しただけだとcdnとかにミスがあって動かなかったのでそこも修正済です。

  HTML5版デモ注意!ロードが非常に重いです
  http://angework.co.jp/demo/AcceleratorProject/AcceleratorProject.html

まんま変換したので、一周するとそのままThirdPersonに戻ります。
HTML5ではこの程度の処理でもかなり重く、リロードするだけでエラーになる場合もあります。
スマホではまず動かないかと。

拙いプロジェクトですが、何かの参考になれば幸いです。

0 件のコメント:

コメントを投稿