Godotで作るSuper Mario Bros Part1 (Player_Collision,Animation,Movement)

始めに

ゲーム遊び作成共無経験の前期高齢者が、ゲーム作成に挑んだ過程を防備録プログとして残すことにしました。作成のきっかけは、定年後の時間的な余裕及びボケ防止、家族と楽しんだmarioゲームを思い出したのが一端です。いろいろ調べて貴プログの欄を見て諦めないぞとの一心でなんとか作成しました。当然難しいことはさっぱりわからず、見様見真似で試行錯誤の繰り返しの連続。何度も挫けそうになりましたがなんとか動作するようになりました。また、プログ環境も一から立ち上げ、完成するのはいつになるやら?

作成ゲーム    Super Mario Bros 1-1のまね

ゲームエンジン  Godot

OS        Ubuntu22.04LTS  

新規プロジェクトの作成

まずは、新規プロジェクトを作ります。

  • 左上の【+新規】をクリックすると新規プロジェクトメニューが表示される
  • プロジェクトパスとはプロジェクトフォルダー作成するフォルダーの事。事前にパソコン上に適当なフォルダーを作成のこと。
  • プロジェクト名を入れ【フォルダー作成】をクリックした後、【作成して編集】作成して編集をクリックすると編集画面となります。

編集画面

run_speed

各データーを収めるデレクトリーの作成及び読み込み

プロジェクトで使用するキャラクター、背景画像等を予め準備するためのフォルダー(Asset)を作成します。またそれ以外のこれから作成するscenes,script等のフォルダーも同時に作ります。(あとでも作成可能)

画面左下のファイルシステムres://を右クリックし+新規作成→フォルダーで作成

フォルダー作成

作成したフォルダー

追加でres://以下 Scenes,Scripts,Tilesets,Level等

キャラクター、背景画像等読み込み  各データーをフォルダーにドラック&ロップすれば完了

画面サイズ設定

次に実際にプレイするウインドウサイズを設定する。

上部メニュー プロジェクト→プロジェクト設定→一般 表示>ウインドウ

  • ビューポート幅、高さを入力
  • アスペクト keep

dd

Level11の作成

これからが、ゲームづくりの始まりとなる。作りはじめの場合は左画面にルートノード生成が表示される。その「2Dシーン」2Dシーンをクリックすると「Node2D」クラスのノードがルートノードとして生成される。

「Node2D 」ノードの名前を「Level11」に変更。

次にシーンとして保存するため、上部メニュー シーン>名前を付けてシーンを保存をクリック

シーン名を「Level11.tscn」に変更し、最初に作成した「Level」デレクトリーをクリックして保存する。もし最初にデレクトリーを作成して無ければ右上の「フォルダー作成」をクリックして作れば良い。

プレイヤーキャラクターノードの作成

「Level11」ノードが同名の「Level11」シーンのルートノードであり、そのルートノードに紐づくノードを子ノードと言う。子ノードにさらにノードがぶら下がって孫ノードとなり、これらのルートの下に紐づく子ノード以下のノードの集まりをブランチという。

シーンを一つの木だとすると、ルートノードが木の幹、ブランチが枝葉である。このような構造を一般的にツリー構造と呼ぶ。Godot の一つの特徴として、このツリー構造を最大限活かして、コンポーネントの構成が非常に分かりやすくなっている。

では「Level11」ノードの子として、「CharactorBody2D」クラスノードを作ろう。

○Level11を選択しその上にある「+」をクリックすると「Nodeを新規作成」メニューが表示される。検索でchaと入れ「CharactorBody2D」を選択後、「作成」クリック

「CharactorBody2D」ノードが出来た。

名前を「Player」に変更

同様に、「Player」ノードの子として「Sprite2D」、「Coliision2D」、「AninationPlayer」クラスノードを追加する。下図の様になれば大丈夫。

プレイヤーアニメーションの作成

マリオアニメーションは複数の画像を使うので、今回は「AnimatedSprite2D」か「AnimationPlayer」クラスを使用する。この時点ではどちらを使用すればいいかあまり解っていなかったが、とりあえず「AnimationPlayer」を使用することにした。

まずは、マリオアニメーションのping画像を準備。16☓16ドット画像を横に21個並べたものを使用

今回は、とりあえずIdle,Run,Jumpの三種類を作成する。(追加はあとでも可能)まず、Idleアニメーションを作成する。右上のシーンで「Sprite2D」をクリック。ファイルシステムの「spr_mario_small.png」を右上のsprite2D>Textureへドラック&ドロップし画像を登録する。Animationの「Hframes」→21、「Vframes」→1に設定する。

「アニメーション」をクリック>「New」>「アニメーションを新規作成」で「Idle」と入力してokを押す。

「+トラックを追加」>「Proparity Track」をクリック

「アニメーションするノードを選択」>「Sprite2D」クリック

「プロパティの選択」で「frame」をクリック。トラックが追加される。

run_speed

次にフレームを登録する。Idelフレームは、spr_mario_small.png画像の0フレーム目なので右のAnimation>Frame数字を0にし右の鍵マークをクリックすると画像が登録される。アニメーションの長さは0.2秒に設定

次にRunアニメーションを作成する。Idleアニメーションと同じ様に登録しトラックを追加するがRunフレームは、spr_mario_small.png画像の1〜3フレーム目なので右のAnimation>Frame数字を1にし右の鍵マークをさん回クリックすると画像が登録される。アニメーションの長さは0.3秒に設定

次にJumpアニメーションを作成する。Idleアニメーションと同じ様に登録しトラックを追加するがJumpフレームは、spr_mario_small.png画像の5⃣フレーム目なので右のAnimation>Frame数字を5にし右の鍵マークをクリックすると画像が登録される。アニメーションの長さは0.2秒に設定

これでとりあえずアニメーションの作成は終了だ。ここで作成したシーンを保存しよう。

プレイヤーコリジョンの設定

Playerのコリジョンエリアの設定、左シーンの「CollisionSharp2D」をクリックし右のインスペクターのCollisionSharp2D>Sharpをクリック。「新規CapsuleSharp2D」を選択するとコリジョン範囲が表示される。

Sharpの右横をクリックし、Redius→5、Height→17に変更

プレイヤー動作テスト グランド作成

とりあえず、プレイヤーの動作確認のため、仮のグラウンド(床)を作成。

○Level11の子として「StaticBody2D」その子として「CollisionSharp2D」を作成する。「CollisionSharp2D」のインスペクターとして「新規RectangleSharp2D」を選択

「CollisionSharp2D」サイズ x→300、y→10とし、適当な位置に置く。

インプットマップの作成(ゲームで使うキー操作の登録)

インプットマップとは、ゲームの入力操作設定だ。キーボードのキーやマウスのクリック、ゲームパッドのボタンなど、ゲームで利用する予定のものを「アクション」として登録することができる。デフォルトの「アクション」もいくつか登録されている。

今回は、すでに組み込まれている「アクション」を使用するので新規に登録しないが方法を説明する。

まずは、「プロジェクト」メニュー>プロジェクト設定を選択する。

アクション名(キー操作名)を入力し「追加」をクリック

マップが作成される。

これから、キー操作を登録するため右端の「+」をクリック

キー登録待ち画面になるので、パソコンキーボードの「右矢印キー」を押す。move_rightなので「右矢印キー」move_leftであれば「左矢印キー」下記画面でokクリックで作成終了。

プレイヤー動作のプログラムを書く

ここからがプログラム作成の世界だ。フゥー 作成言語はGDScript、C++があるらしが初心者の私は当然のごとくGDScriptを選択した。

左側の「シーン」で「Player」を選択し、上部の「ノードにスクリプトをアタッチする」をクリック。サブ画面が表示される。

テンプレートは「Charactor2D:Basic Movement」を選択 基本的な動作が記入されている。

パス名は「res://Scenes/Player.gd」に変更

「Player.gd」が作成される。Gravityは重力で「プロジェクト」>プロジェクト設定>物理>2Dの「Default Gravity」で変更可能。

「Player.gd」を下記の様に変更する。今回は基本動作のみで随時機能を追加していく。

extends CharacterBody2D

@export var run_speed:float = 200.0     #@exportで「インスペクター」で値変更可能 200ピクセル/秒
@export var jump_velocity:float = -400.0

var gravity = ProjectSettings.get_setting(“physics/2d/default_gravity”) #重力

func _physics_process(delta):
# Add the gravity.
if not is_on_floor():
velocity.y += gravity * delta

# Handle jump.
if Input.is_action_just_pressed("ui_accept") and is_on_floor():#playerが「床」に居る時、jump button「スペース」ボタンが押された場合、速度を加える。速度はマイナス(画面上の方に移動する場合マイナス、下の方に移動する場合はプラス)
        velocity.y =jump_velocity
# Handle direction.
var direction = Input.get_axis("ui_left", "ui_right")   #ui_left =-1  ui_right=1 not= 0
if direction:
    velocity.x = direction *run_speed          #方向にrun_speedを設定
else:
    velocity.x = move_toward(velocity.x, 0,run_speed)         #減速
update_animation(direction)                                                        #アニメーション関数              
move_and_slide()

func update_animation(direction):

if not is_on_floor():
    animation_player.play("Jump")
elif direction != 0:
    sprite_2d.flip_h =(direction < 0)
    animation_player.play("Run")
else:
    animation_player.play("Idle")

取り敢えず、基本動作が可能となった。

コメント

タイトルとURLをコピーしました