Добавляем 3D в игру на Flame, не переписывая её
3D-графика в 2D-играх без переписывания кода.
Команда разработчиков представила пакет flame_flutter3d, который служит мостом между популярным 2D-движком Flame и чистым Dart-движком flutter3d. Это позволяет добавить объем, свет и тени в существующие проекты, сохранив всю игровую логику, джойстик и HUD на стороне Flame.
💡 Архитектура строится на едином времени.
Второй тикер для 3D не создается. Вместо этого компонент BridgeClock синхронно с тикером Flame вызывает обновление 3D-сцены с тем же значением дельты времени. Это исключает рассинхронизацию таймеров и гарантирует, что оба движка работают в едином ритме.
🔧 Инженерные решения для стыковки систем.
Класс BridgePlane решает проблему разных координатных систем: Vector2 у Flame и Vector3 у flutter3d. Он определяет, как оси 2D проецируются в 3D (например, для видов сверху или сайд-скроллеров). Столкновения, рассчитанные 3D-физикой, транслируются во Flame как стандартные события, такие как onCollisionStart.
🎮 Практический пример: аркада Meteor Yard.
В демо-игре корабль летает в 3D-пространстве, но управление остается 2D. Боты используют CharacterController с нулевой гравитацией, что упрощает их движение в воздухе. Логика ИИ включает три состояния: уклонение, погоню и патрулирование.
⚠️ Важные ограничения и нюансы.
Мост не передает нормали и глубину проникновения в колбэки Flame — там только приблизительные точки контакта. Также нельзя удалять объекты прямо внутри колбэка столкновения, так как это нарушает итерацию списков. Решение — очередь удаления, обрабатываемая в начале следующего кадра.
⚡ Производительность и детерминизм.
Симуляция в flutter3d_sim детерминирована: результат прогона идентичен бит в бит при заданном seed. Это основа для будущих сетевых игр с механизмом отката (rollback). Загрузка моделей glTF происходит в фоновом изоляте, не блокируя UI.
📦 Требования к настройке.
Для работы необходимо включить поддержку Flutter GPU в манифесте (FLTEnableFlutterGPU для iOS/macOS, EnableFlutterGPU для Android). Иначе вместо 3D-графики вы увидите пустой экран. Игра должна наследоваться от TransparentFlameGame, чтобы 2D-слой был прозрачным.
🔗 Полезные ссылки
flame_flutter3d на pub.dev
Исходный код flutter3d
Примеры интеграции
🔗 Полезные ссылки
📦 flame_flutter3d
💻 flutter3d
💻 flutter3d
📰 Читать оригинал на Habr
FlutterPulse — канал о мире Flutter!
#flutter #dart #flutterpulse #flutterpulsehabr
3D-графика в 2D-играх без переписывания кода.
Команда разработчиков представила пакет flame_flutter3d, который служит мостом между популярным 2D-движком Flame и чистым Dart-движком flutter3d. Это позволяет добавить объем, свет и тени в существующие проекты, сохранив всю игровую логику, джойстик и HUD на стороне Flame.
💡 Архитектура строится на едином времени.
Второй тикер для 3D не создается. Вместо этого компонент BridgeClock синхронно с тикером Flame вызывает обновление 3D-сцены с тем же значением дельты времени. Это исключает рассинхронизацию таймеров и гарантирует, что оба движка работают в едином ритме.
🔧 Инженерные решения для стыковки систем.
Класс BridgePlane решает проблему разных координатных систем: Vector2 у Flame и Vector3 у flutter3d. Он определяет, как оси 2D проецируются в 3D (например, для видов сверху или сайд-скроллеров). Столкновения, рассчитанные 3D-физикой, транслируются во Flame как стандартные события, такие как onCollisionStart.
🎮 Практический пример: аркада Meteor Yard.
В демо-игре корабль летает в 3D-пространстве, но управление остается 2D. Боты используют CharacterController с нулевой гравитацией, что упрощает их движение в воздухе. Логика ИИ включает три состояния: уклонение, погоню и патрулирование.
⚠️ Важные ограничения и нюансы.
Мост не передает нормали и глубину проникновения в колбэки Flame — там только приблизительные точки контакта. Также нельзя удалять объекты прямо внутри колбэка столкновения, так как это нарушает итерацию списков. Решение — очередь удаления, обрабатываемая в начале следующего кадра.
⚡ Производительность и детерминизм.
Симуляция в flutter3d_sim детерминирована: результат прогона идентичен бит в бит при заданном seed. Это основа для будущих сетевых игр с механизмом отката (rollback). Загрузка моделей glTF происходит в фоновом изоляте, не блокируя UI.
📦 Требования к настройке.
Для работы необходимо включить поддержку Flutter GPU в манифесте (FLTEnableFlutterGPU для iOS/macOS, EnableFlutterGPU для Android). Иначе вместо 3D-графики вы увидите пустой экран. Игра должна наследоваться от TransparentFlameGame, чтобы 2D-слой был прозрачным.
🔗 Полезные ссылки
flame_flutter3d на pub.dev
Исходный код flutter3d
Примеры интеграции
🔗 Полезные ссылки
📦 flame_flutter3d
💻 flutter3d
💻 flutter3d
📰 Читать оригинал на Habr
FlutterPulse — канал о мире Flutter!
#flutter #dart #flutterpulse #flutterpulsehabr