Godot4.1.3でシューティングゲームを作っていきます。
スクロールする宇宙の背景を設定
本記事で、背景に宇宙を設定して、縦にスクロールさせます。
github
本記事で実装したものをgithubで公開しています。
背景について
3D空間の背景なので、Playerが上下左右360°どの方向を向いても背景が存在するようにしました。イメージとしては、Playerを中心とした大きな球があって、その球の内側に宇宙の画像を貼り付けるような感じです。
球の内側は平面ではないので、球の内側に貼りつけたときにきちんと見えるように、パノラマ画像を使用します。
NASAの宇宙画像を使うと格好良かったのですが、教育以外の目的には使用できなさそうなので、Blenderで作成しました（思ったより時間がかかりました）。シェーダーで星空と星雲を作って、レンダリングする時にレンダーエンジンをCyclesにし、カメラのレンズのタイプを「パノラマ状」、パノラマタイプを「正距円筒図」にして出力したものを使っています。出力画像サイズがディフォルトの1024pixelの場合、スクロールしたときのゆがみが大きかったため4096pixelに変更しました。もっと大きくするとゆがみが目立たなくなると思いますが、ファイルサイズが大きくなるのと、レンダリング時間がかかるため、適切なサイズを考える必要があります。
パノラマ画像の上の方（もしくは下の方）を見ると、左右に伸びていますが、球の内側に貼ると正しく見えるようになっています。
背景に宇宙を設定する
WorldEnvironmentを使って、背景を設定します。
「WorldEnvironment」ノードを追加します。
WorldEnvironmentのインスペクターを開きます。新規Environmentを作成して、Background/ModeでSkyを選択すると、「Sky」項目が表示されます。
新規Skyを作成し、新規PanoramaSkyMaterialを作成します。Panoramaは「クイックロード」を選択して、あらかじめ用意した宇宙の画像を選択します。
クイックロードから背景のspace.pngを設定するとこのようになります。
背景をスクロールする
WorldEnvironmentにスクリプトをアタッチして、下記のようなGDScriptにします。
1秒に5°背景の宇宙を回転します。
extends WorldEnvironment
@export var m_d_speed_degps = -5.0 # 回転速度 [degree/sec]
func _process(delta):
get_environment().sky_rotation.x += deg_to_rad(m_d_speed_degps * delta)
微調整
背景の宇宙がスクロールするようになりましたが、上下にゆがみが目立つため、Custom FOVを45°に設定して目立たないようにしました。
あと、原因がわかっていませんが、背景の宇宙に薄く青い線が入るため、見えにくいよう位置を適当に探した結果、Sky/Rotationのzに100°を設定しました。
パノラマ画像の上の方をゆがみを3D空間で確認する
パノラマ画像の上の方のゆがみの部分が3D空間でどのように見える確認するため、space.pngの画像の上の方に赤い四角を書いて、Godotにインポートしてみました。
Godotの3Dビューで、上の方（Y軸プラス側）に視点を変えると、赤い線が見えました。球の内側に貼りつけるとき横方向に圧縮されるように貼り付けられるので、横方向に延ばされた星は正しく点の星に見えるようになり、赤い四角はつぶれて線になっています。
まとめ
背景を設定すると雰囲気が出て、だいぶ良くなりました。
しかし上下のゆがみが気になるので、別の方法にすることを検討しています。
以上です。