Phaser 3 : リボントレイルを作る② パスに沿ったメッシュを作成する

前回に引き続きリボントレイルを作成します、 前回は基本的なメッシュを作成したので、今回はパスに沿ったメッシュを作成したいと思います。 gpnotes.hatenablog.jp Phaser.Curveでベジェ曲線を作成する カーブのポイントと次ポイントのベクトルに直交するベ…

Phaser 3 : リボントレイルを作る① Meshを使う

今回からはトレイルエフェクトを作ってみたいと思います。 トレイルはオブジェクトが動いた際の軌跡を描くエフェクトです。 もっとも簡単なトレイルの実装はスプライト等表示物そのものを複製しながらアルファ値を変えるなどして通過点上に配置するやりかた…

Phaser3 : Web Speech Apiを用いた読み上げ神経衰弱

今回はWeb Speech APIを用いた合成音声の読み上げをしてみます。 Web Speech APIはPhaser3独自の機能というわけではないのですが、Phaser3と組み合わせて使うことができるので、試しにこちらを使って読み上げ式の神経衰弱を作ってみようと思います。 SpeechS…

Phaser3 ゲームオブジェクトの拡張② : maskを使う

前回に引き続きオブジェクト拡張を使いながらアニメーションを作っていきます。 gpnotes.hatenablog.jp maskを使う mask.invertAlphaで画像を切り抜く .onでテキストにクリック処理を追加する maskを使う maskを使って黒電話のダイアル部分を作ってみます。 …

Phaser3 ゲームオブジェクトの拡張①: runChildUpdateを使う

今回はゲームオブジェクトの拡張について勉強します。 ゲームオブジェクトの拡張 add.existingでシーンへの追加を行う runChildUpdateでオブジェクトにupdateを実行させる ゲームオブジェクトの拡張 gpnotes.hatenablog.jp 以前の記事中リンクで紹介しました…

Phaser3 Pathを使ってみる

先日経路探索ライブラリを導入したので、今回はPhaserのPathを用いて経路を表示してみたいと思います。 gpnotes.hatenablog.jp Pathで曲線描画 pathを使ったtween Pathで曲線描画 PathはPhaser3から導入された新機能で、各種曲線や直線を作成することができ…

Phaser 3 :迷路ゲームを作る④ 経路探索ライブラリを使う、timelineを使う

引き続き迷路ゲームを作っていきます。 今回は経路探索ライブラリを用いて目的地まで自動で移動する処理を作ってみます。 gpnotes.hatenablog.jp 経路探索ライブラリを使う 経路探索ライブラリ用の配列を作成する tween.timelineで経路に沿ったtweenを作成す…