Phaser3 オブジェクト,Phaser3

Phaser 3でオブジェクトのgroupを作成、追加、削除などのgroup関連のサンプルコードまとめです。 ※当サイトの記事で紹介しているサンプルコードは物理演算に2D Phaser3ゲームで主流のArcade Physicsを利用してい ...

Phaser3 ゲーム,Phaser3

Phaser 3の記事で紹介しているサンプルコードに使っている全体的な基本構造です。 Phaser 3ではベースになるスクリプトの構造に様々な書き方があり、極力共通で使えるコードになるように考慮はしていますが、内容によってはサンプルコードが ...

2020-09-14Phaser3 カメラ,Phaser3

Phaser 3でUI用のカメラの作成・設定方法のサンプルコードです。 Phaser 3では主にUI用のカメラをシーンに追加して表示するオブジェクトを設定する方法と、UI用のシーンを作成してゲームのシーンと同時に走らせる方法があります。 こ ...

2020-09-15Phaser3 カメラ,Phaser3

Phaser 3でカメラをプレイヤーに追従させる方法のサンプルコードです。 紹介しているサンプルコードを使っているサイドビュー視点のサンプルゲームです。   ※このサンプルゲーム内のコードでは、コードに変更が加えられている場合があります。 ...

2020-09-14Phaser3 ゲーム,Phaser3

サイドビューの横スクロールアクションゲームで、WASDキーを使ってプレイヤーを移動させる用のPhaser 3サンプルコードです。 紹介しているサンプルコードを使っているサンプルゲームです。※このサンプルゲーム内のコードでは、コードに変更が加 ...

2020-07-11Phaser3 アニメーション,Phaser3

Phaser 3でも使える無料のAtlasesデータ生成ツールのメモ phaser3にはTexture Packerが対応していますが、無料版でも高機能にみえてまずスプライトシートが読み込めないというね 結局、Texture Packerの ...

2020-09-13Phaser3,Phaser3 Tween

Phaser 3のTweenを使ったフェードアウトとフェードインを実装する方法です。 Tweenを使ったフェードアウトの実装サンプル See the Pen Phaser 3 Tween FadeOut by yochans (@yocha ...

2020-07-11Phaser3,Phaser3 シーン

Phaser 3でシーンを作成する方法とコンフィグ設定にシーンを追加する方法です 利用するシーンをコンフィグに設定する scene:とする事でコンフィグに利用するシーンを設定できます(ひとつの場合は配列じゃなくてもOK) 複数のシーンを設定 ...

2020-07-11Phaser3,Phaser3 シーン

Phaser 3でシーンを切り替える(移動・移行)する方法です See the Pen Phaser 3 Chenge Scenes by yochans (@yochans) on CodePen. シーンの切り替えにはシーンを移動するイ ...

2020-07-11Phaser3,Phaser3 グラフィックス

Phaser3のGraphicsを利用して簡単な図形を描画する方法です Graphicsの基本コード graphics()を利用します 全てではないと思いますが、graphics()内に配列にて指定していく事が可能 let graphics ...

2020-07-11Phaser3,Phaser3 ロードファイル

Phaser3で各ファイルタイプ別プリロードの実装方法です 単一画像ファイルのプリロード 画像ファイルのプリロードはload.image()で利用します preload() { this.load.image('image', 'image ...

2020-07-11Phaser3,Phaser3 テキスト

phaser3のadd.text()で作成・表示したテキストにクリックイベントを実装する方法です See the Pen Phaser 3 text set touch events by yochans (@yochans) on Cod ...

2020-07-11Phaser3,Phaser3 テキスト

テキストを指定範囲内で中央揃えさせる方法は色々ありますがadd.text()でのoriginパラメータの指定やsetOrigin()で基準値を利用するのが簡単です X軸とY軸で指定する基準値を変える場合はsetOrigin(0.5,1)での ...

2020-09-14Phaser3,Phaser3 テキスト

単純なテキストの表示 Phaser 3でテキストを表示するにはadd.text()を利用します。 let text = this.add.text(X座標, Y座標, 文字列); 必須因数として、第一因数にX座標、第二因数にY座標、第三因数 ...