HatenaPocket本稿はJavaFXプログラミングでゲームスクロールを実装する方法を考えてみたいと思います。ゲームスクロールはシューティングゲーム、アクションゲーム、RPGなどで必要になります。私は、今までswing、awtでゲームを制作したときに使用したスクロールは下記の二点があります。1.全オブジェクトの座標はウィンドウ内座標(クライアント座標)を保持し、動かない物体等は逆側に移動させ、スクロールしているように見せる。2.全てのオブジェクトの座標はワールド全体の座標で保持し、描画時に自作カメラクラスの座標を元に計算して表示する。当初1の方法でRPGのスクロールを実現した時にややこしすぎて2の方法を考えた記憶があります。今回は2のスクロールに似た方法になりますが、カメラは自作せず、JavaFXのカメラクラスを利用して少し楽にスクロールを実現してやりたいなと思います。目次1.カメラクラスの種類2.PerspectiveCameraクラスの使用方法3.ステージをユーザーのカメラ操作でスクロールする4.キー操作で動く自キャラにカメラを追従させたスクロール1.カメラクラスの種類カメラクラスにはParallelCamera、PerspectiveCameraが用意されています。ParallelCameraは平行投影(正射投影)をする。わかりませんが、常に中心に位置するらしいです。試したところ、Z座標が反応しなくて、本来のデータの大きさが表示されました。これは使いどころがあまりなさそう。PerspectiveCameraは透視投影カメラなんですって。こっちもよくわからんけど。こちらはx、y、z座標を考慮した風景が描画されます。一般的な3Dゲームもこちらのカメラの方式を使用しているのでしょう。2DオンリーであればParallelCameraでも問題ないのですが、PerspectiveCameraを利用すればZ座標を操作することで、ズームインズームアウトのような処理も実現できます。今回は背景の奥行きスクロールをZ座標を使って実装したいと思っているので、PerspectiveCameraクラスを使用してスクロールを実現してみましょう。2.PerspectiveCameraクラスの使用方法インスタンス化して、Sceneオブジェクトに設定しておけば準備完了です。あとは、translateXやtranslateYなどを設定してカメラ座標を変更することで描画位置が変更されます。カメラの座標はウィンドウ内描画領域のちょうど左上と一致します。カメラ座標設定イメージ試しに、X座標上にここが今どこかを文字列で表示させるオブジェクトを横並びに配置しておき、カメラスクロールで確認しに行くサンプルを作成してみます。本当はTextオブジェクトを配置したかったんだけど、ウィンドウのサイズ分の座標までしか文字が表示されなかった。したらJavaFXのバグかもしれないです(Java9の時点)。TextクラスとPerspectiveCameraクラス一緒に使えないやないか!!誰かうまく表示する方法知ってませんか?3.ステージをユーザーのカメラ操作でスクロールするアクションゲームのステージのような背景を構築し、ユーザーがカメラを操作してスクロールする機能を作成してみます。ステージを構築するための画像をいろいろ用意しました。数分で作れるような手抜き画像です。nono.gifnono_stop.gifsora.pngyama.pngki.pngkusa.pngkusa2.pngjimen.pngこれらを利用してステージを構築します。奥行きも考慮したいので2Dではあまり使用されないZ座標も設定します。奥行きの指定ですが、Nodeオブジェクトに対してZ座標を指定します。Z座標が大きくなれば、オブジェクトは遠くにあるように描画されます。遠くにあるものほど、画像が小さく描画され、スクロール量を自動で小さくしてくれます。空はZ座標を大きく、山はその次に大きく、木はその次に大きく・・・といった感じにZ座標を指定します。Z座標の指定はsetTranslateZメソッドで指定できます。キャラクタを用意したのは、ステージ上を歩かせるためです。キャラクタの移動とカメラの移動はこちらの記事でも紹介したAnimationTimerクラスで実装します。カメラの操作はこちらの記事で紹介した方法でキー操作処理を実装します。書いてもしょうがないので、実装サンプルとサンプルソースのコメントを参考にしてください。"左右キーでカメラを移動させます。{//上下左右キーを押した時フラグをONにする。{//上下左右キーを離した時フラグをOFFにする。false;break;default:break;}}}実行結果サンプルプログラムではオブジェクトを配置しっぱなしにしていますが、実際のゲームでは座標によってオブジェクトを描画するかしないかの制御をする必要があります。いうと、画面外にあるオブジェクトも描画してしまうと無駄な処理が増え、処理速度が遅くなってしまうからです。オブジェクトの描画を拒否するにはsetVisible(false)を指定してあげましょう。実際に大量にオブジェクトを配置すると処理が重くなりますが、これを設定するだけで、処理速度は遅くならなくなりました。4.キー操作で動く自キャラにカメラを追従させたスクロールキャラクターに追従したスクロールを実現するにはカメラ座標をキャラクタ座標に合わせて変更することで実現できます。カメラが表している座標はウィンドウ内描画領域の左上の座標です。ウィンドウの幅の半分)の計算結果をカメラ座標に毎フレーム設定しておけば実現できます。※このイメージは横スクロールのみを想定しており、Y座標は0で設定するという前提です。それではサンプルをご覧ください。"左右キーでキャラを移動させます。{//キー押し下げ時の方向に移動します。{//上下左右キーを押した時フラグをONにする。{//上下左右キーを離した時フラグをOFFにする。false;break;default:break;}}}実行結果テスト用の画像は目次3で利用した画像を使用しています。これでキャラに追従するスクロールの実装が完了しました。今回は横スクロールのみでしたが縦スクロールも同じような考え方で実現できます。...【JavaFX:横スクロールアクションゲーム】ステージの表示を実装ブロックなどを表示して、ステージを作成してみます。...【JavaFX】オブジェクトに色、透明度を適用する本稿ではオブジェクトに対して色や透明度を適用させてみたいと思います。コメントをキャンセルメールアドレスが公開されることはありません。当サイトのプライバシーポリシーについてはこちらからご参照いただけます。