7
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

DartAdvent Calendar 2015

Day 18

Dart x Umiuni2D : Flutter と WebGL上で動作する2Dゲームエンジンを作ってみた

Last updated at Posted at 2015-12-24

Flutter と WebGL上で動作する2Dゲームエンジンを作ってみました。
紹介します。

Umiumi2D (海ウニ2D)
http://kyorohiro.github.io/umiuni2d/web/index.html

※ iOS と Android と 手持ちの端末のブラウザーで動作する事を確認しています。


[きっかけ] 作ったゲームを、Windowsでも動作できるようにしたい。

Flutterを利用して何かを作りたいなぁと考えていました。ちょうど、ビデオゲームの歴史を調べていたので、2Dゲーム用のライブラリを作る事にしました。

しかし、FlutterではWindowsに対応できません。近々で、Flutter のブラウザー版は開発の予定がなかったのと、Windows向けの実装がほとんどありませんでした。

せっかく、サーバサイド、ブラウザー、モバイル、組み込みLinuxまで利用用途を広げているDartでロジックを書いているのに、利用用途がモバイルだけなのはもったいないです。

そこで、Flutter と ブラウザーの両方で動作するゲームエンジンを作る事にしました。
※ Flutter がダメになっても、Dart x Chrome Mobile で動作させる事もできるので、保険にもなります。

[機能] 基本機能は揃ってきたかな

ミニゲームを作成するのに必要なのは、SpriteとPrimiveを表示する機能ではないかと、考えました。そこから実装を始めました。 
また、実際に、落ち物パズルゲームを作成しながら、必要な機能を洗いだしていきました。

(丸) たくさんのSpriteを同時に表示する

about.jpg

(丸) Primitiveを表示する

about.png

(丸) タッチ操作

about.png

(丸) 効果音の再生

about.png

(丸) 物理

about.png

(丸) Spriteシート

about.png

(丸) Bitmapフォント

about.png

(丸) 画像の貼り付け方法の指定

about.png

(丸) clipRect

about.png

デモアプリも作成してみた

ひとつ前のバージョンについて、iOSでも動作確認しました。ファイル関連の処理以外は期待した通りに動いています。

wonder_minon_AB01.png



------- Kyorohiro Work http://kyorohiro.strikingly.com/
7
6
3

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
7
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?