テンプレ通りのゲーム制作 FPS③カメラのエイミング
入力アクションを登録
前回の続きからやっていこうかと思います。今回は新しい動作としてFPSゲームでよくあるエイミングを実装していきたいと思います。前回の記事は以下の通りです。
新しい種類の入力を追加しますので新しい入力アクションが必要です。以下のフォルダに入力アクションを追加します。
コンテンツ/Firstperson/Input/Actions
名前はIA_Aimにします。
入力アクションを入力マッピングコンテキストに登録します。
コンテンツ/Firstperson/Input/ActionsのIMC_Weaponsを開き、Mappingsの+ボタンを押して追加し先ほど作ったIA_Aimを登録します。マウスの右ボタンとゲームパッドの左ショルダーを追加しました。キー割り付けは任意で追加、変更しても構いません。
これで新しい入力アクションを追加できました。
プレイヤーの入力イベントを追加
プレイヤーのクラスブループリントを書き替えます。下記のファイルをダブルクリックしてブループリントエディタを開きます。
コンテンツ/FirstPerson/Blueprints/BP_FirstPersonCharacter
空いているところを右クリックして先ほど作ったIA_Aimの入力イベントを作ります。
次にコンポーネントパネルからFirstPersonCameraをクリックののち入力イベントの横にドラッグします。
ドラッグしたノードからワイヤを伸ばして「Set Field Of View」を選びます。「In Field Of View」のスロットには45.0を入れておきます。Field Of Viewとは「視野」という意味です。バンド名じゃありません。視野角45度に設定しました。実行ピンを入力イベントにつなぎ、ノードが組めたらプレイしてみましょう。登録したキーを押すと視野角が狭まってエイミングが出来たはずです。
エイミングできた！…が
これでエイミングが出来たのですが、一回視野角が狭くなるとそのあと元に戻せません。これでは困るのでつぎに離したときにもとの視野角に戻す処理を作りましょう。
標準視野角に戻す
標準の視野角は90度です。これをゲーム開始時に保存しておきます。二つのFloat値を格納できる変数を作ります。「ViewNormal」と「ViewAim」という名前にしました。コンパイルボタンを押して詳細パネルのデフォルト値それぞれViewNormal＝90.0、ViewAim＝45.0を入れておきます。
つぎに、ゲーム開始時に実行されるBeginplayイベントを上部の空いているところに右クリックして作ります。ViewNormal変数をドラッグしてSetノードを置きます。次にコンポーネントパネルからFirstPersonカメラをドラッグして出力ピンから「FieldOfView」のGetノードを引き出して最終的に画像のように組みます。
これで視野角を保存することが出来ました。
IA_Aimのイベントに戻り下記の画像のようにノードを組みます。このプログラムの意図としてはキーを押したとき（Triggered）にはFirstPersonCameraの視野角にViewAimの値をセットし、離したら（Completed）ViewNormalの値をセットし元に戻しています。
ゲームを開始してみると…あれ？キーを離しても希望したように動きません。Completedから標準視野角に戻す処理に進んでいないようです。これを直します。
入力マッピングコンテキストを開き、IA_AimのTriggersをプラスボタンを押して追加し、プルダウンからダウンを選びます。
これでキーを離すと元の視野角に戻るようになるはずです。
エイム操作が出来た！
スムーズなエイミング
エイミング操作は出来ましたが画面がパッと切り替わってあまりスムーズではありません。これをスムーズにするためにタイムラインノードを使ってみましょう。IA_Aimの白い実行ピンから右にドラッグしてノード作成パネルを出し、「Time…」と検索してAddTimelineを選びます。名前を「Aiming」にします。追加ボタンを押してフロートトラックを追加し「alpha」とトラック名を付けます。長さを0.50にします。
長さとフロートトラック名を追加
タイムラインのフロートトラックを作っていきます。グラフ内の白い線をSHIFTを押しながら２カ所どこでもいいのでクリックしてキーを作ります。
つぎに２カ所のキーをそれぞれ時間と値を
- 時間：0.0 値：0.00
- 時間：0.5 値：1.00
に設定します。一直線のリニアなグラフになっているはずです。グラフのラインがはみ出す場合は上下左右の矢印ボタンを押して枠に納めます。
それぞれのキーを右クリックして「自動」にします。直線だったグラフにイーズインイーズアウトの緩急がつきます。設定出来たらイベントグラフのタブを押します。
タイムラインノードのAlphaピンからワイヤを伸ばし「Lerp」ノードを追加します。LerpとはLinear interpolationの略で「線形補完」という意味です。AピンとBピンの値の間を補完して中間値を作ります。
LerpノードのAピンBピンにViewNormal、ViewAimのGetノードをつなぎます。
最終的に画像のようにノードネットワークをつなぎます。入力イベントのCompletedにタイムラインノードのReverse、つまり逆再生につなげています。それに伴い、右側の視野角を変更できるSetFieldOfViewノードはタイムラインノード一つだけで「再生」「逆再生」が出来るため、ひとつだけにしています。
再生してみましょう。これでスムーズなエイミングが実現できたはずです！
エイムの速さやエイム時の視野角はこれまで勉強したことを踏まえて好みのパラメータに変更してみてください。これで市販FPSゲームのような表現が出来ました。
Discussion