前のページはこちら

Flame組込み前の下準備

まずはFlutterからFlameを呼び出すHello,World的な必要最低限の第一歩を始めてみます。

ゲームを作る

「あなたのゲーム」という名前でゲームを創ってみます。

libフォルダにyour_game.dartを作成します。コードは次の通りです。

import 'package:flame/game.dart';

int worldCount = 0;

class YourGame extends FlameGame {

  @override
  Future<void> onLoad() async {
    print("ゲームが生まれた");
  }

  @override
  void update(double dt) {
    super.update(dt);
    worldCount++;
    print("ゲームが動いている$worldCount");
  }
}

これで単純なゲームクラスが準備出来ました。

ゲームをmainに組み込む

main.dartに先ほどのゲームを組み込んでいきます。

ヘッダ追加

まずはヘッダにこちらを追加します。1つはゲームの世界を作る為に必要なパッケージで、もう1つは先ほど作ったyour_gameのソースコードです。

import 'package:flame/game.dart';
import 'your_game.dart';

_MyHomePageStateを修正

_MyHomePageState内のbody:部を次のように修正します

  • 先頭にYourGameクラスのオブジェクトyourGameを生成。
  • bodyでGameWidgetを生成。引数のgame:　に先ほど生成した「yourGame」を入れる
class _MyHomePageState extends State<MyHomePage> {
  YourGame yourGame = YourGame(); //これを追加

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: const Color.fromRGBO(0, 0, 0, 1),
        appBar: AppBar(
          title: Text('Flame学習帳'),
        ),
        body: GameWidget(game: yourGame));　 //ここを変更
  }
}

実行

実行するとゲームが生まれ、ゲームが動いている旨のログが出現します。FlutterWebではブラウザがアクティブになっていると動くようです。

次のページはこちら

onLoadとupdate