10
12

JSでスイカゲームみたいなの

Last updated at Posted at 2023-10-22

なにそれ

落ち物ゲームです
同じ大きさの野菜くっつけてどんどんデカくしていくやつです

大体の仕様

実はスイカゲームやったことないので雰囲気で仕様決めます
上から玉落とせる
同じ大きさ同士ならぶつかった中心点に1つ上の大きさの玉を出現させる。
最後の玉が一定のラインを超えたらゲームオーバー

完成形

CPT2310221529-1024x602.gif

URL

どうやって作った

vite+TSでセットアップして、phaser3というゲームライブラリで作成しました

適当に実装しましたがphaser3がすごいのである程度それっぽくなりました

phaser3
https://phaser.io/phaser3

人気そうな入門記事にもリンクしておきます
https://qiita.com/41semicolon/items/0d2f2509d4ac1558badb

viteとphaserのセットアップはたしか以下記事を参考にしました
https://dev.classmethod.jp/articles/phaser-js-typescript-vite/

ソース

メインのソースは↓
https://github.com/babu-ch/ballgame/blob/main/src/scenes/MyScene.ts

phaserに詳しくないので書き方が変とかあるかもです
ちょっと判定が増えるだけでコードが汚くなってくるのできれいな書き方を知りたい

あとボール同士がくっついた時ねっとり移動するんですが、それがなぜなのかわかってません
でも気に入っています

SPにも対応してみました

対象のPR
https://github.com/babu-ch/ballgame/pull/1

とりあえずで対応したのでちょっと雑です(ボールサイズがPC版と同じとことか)

スクリーンショット 2023-10-24 20.49.22.png

おわり

この玉の色の種類はチャットGPTに出してもらいました
可愛い色合いですね

スクリーンショット 2023-10-22 15.41.06.png

パワーアップさせる記事を追加しました

10
12
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
12