Розробка мобільної гри на Flame (Flutter)

Розробка мобільної гри на Flame (Flutter)

Flame — ігровий движок поверх Flutter. Не окремий фреймворк, а пакет, який додає game loop, систему компонентів, фізику та обробку вводу прямо в Flutter-проект. Це значить: одна кодова база для гри та для UI навколо неї (меню, настройки, магазин), нативна робота на iOS, Android, Web та Desktop.

Вибирають Flame, коли: команда вже працює на Flutter та Dart, потрібна 2D-гра без важкого ігрового движка, або ігровой контент вбудовується в існуючий Flutter-застосунок.

Архітектура Flame

Flame використовує Component/Entity систему. FlameGame — кореневий компонент з game loop. Component — базовий клас для всього: спрайти, тексти, коллізії, UI-елементи.

class SpaceGame extends FlameGame {
  @override
  Future<void> onLoad() async {
    add(Player());
    add(StarBackground());
    add(EnemySpawner());
  }
}

HasCollisionDetection mixin додає коллізії. ShapeHitbox (Rectangle, Circle, Polygon) — хітбокси. Callbacks onCollisionStart, onCollision, onCollisionEnd.

Тики та фізика. Flame надає update(double dt) — delta time в секундах. Фізика через Forge2D (Box2D-порт для Dart) — окремий пакет flame_forge2d. Для простих ігор вбудована коллізійна система Flame достатня без Box2D.

Практика: типовий компонент

class Enemy extends SpriteComponent with HasGameRef<SpaceGame>, CollisionCallbacks {
  Enemy() : super(size: Vector2(64, 64));

  @override
  Future<void> onLoad() async {
    sprite = await gameRef.loadSprite('enemy.png');
    add(RectangleHitbox());
  }

  @override
  void update(double dt) {
    super.update(dt);
    position.y += 150 * dt; // рух вниз
    if (position.y > gameRef.size.y) removeFromParent();
  }

  @override
  void onCollisionStart(Set<Vector2> points, PositionComponent other) {
    if (other is Bullet) {
      removeFromParent();
      gameRef.score.increment();
    }
  }
}

removeFromParent() — правильний спосіб видалення. remove() напрямки через gameRef додає затримку на один тік.

Продуктивність у Flame

Flame рендерит через Flutter's Canvas API — це не GPU-інстансинг, а прямі виклики canvas.drawImageRect. Для великої кількості однакових спрайтів (100+ частинок, пуль) використовуємо SpriteParticle з пакета flame_particles або власний CustomPainter з drawAtlas — це батчить рисування в один draw call.

Sprite Sheet. SpriteAnimation з атласу — SpriteSheet.fromColumnsAndRows. Завантаження окремих PNG для кожного кадру — анти-паттерн. gameRef.images.load() кешує зображення, повторні виклики повертають кеш.

Flame сидить на Flutter widget tree — це дає доступ до FlameGame.overlays для вбудовування Flutter-віджетів (кнопки паузи, счёт, модальні вікна) прямо поверх canvas без окремого шару.

Обмеження

3D в Flame відсутня. Складна фізика (ragdoll, joints, чутливі до фізики пазли) — Forge2D справляється, але Unity Box2D інтеграція зрілша. Якщо проект потребує серйозної 3D-графіки — Flame не той вибір.

Розмір спільноти менший, ніж у Unity/Godot — плагінів менше, Stack Overflow-відповідей менше.

Терміни

Гіперказуальний або казуальний прототип: 3–6 тижнів. Повнофункціональна 2D-гра з прогресією, магазином, інтеграцією AdMob та IAP: 2–5 місяців. Вартість розраховується після аналізу концепції гри.